shadowpacker

Add awesome shadows for the non-designer

Usage no npm install needed!

<script type="module">
  import shadowpacker from 'https://cdn.skypack.dev/shadowpacker';
</script>

README

What is this?

Get perfect shadows every time for the non-designer.

Installation

npm i shadowpacker --save

Then...

import {shadowpacker} from 'shadowpacker';

shadowpacker({
    shadow_type:'soft',
    padding:true,
    padding_distance:"1.5em",
    shadow_color:"#ddd",
    shadow_animate:true,
    shadow_animation_duration:5
});

Options

shadowpacker supports 6 options, both of which are optional:

  • shadow_type - hard | soft (Defaults to soft)
  • padding - boolean (Defaults to false)
  • padding_distance - valid distance unit (Defaults to 1em) (to be provided only when padding option is true)
  • shadow_color - valid rgba or hex color (Defaults to rgba( 0, 0, 0, 0.12))
  • shadow_animate - boolean (Defaults to false)
  • shadow_animation_duration - time in secs (Defaults to 1 sec) (to be provided only when shadow_animate option is true)