cosha
Colorful shadows for your images
Last updated 19 days ago by rbnlffl .
MIT · Repository · Original npm · Tarball · package.json
$ cnpm install cosha 
SYNC missed versions from official npm registry.

cosha

latest version on npm npm downloads a month required node version dependency status package license

Colorful shadows for your images. ????

cosha lets you add colorful shadows to your images. Try it out and look for yourself—the bundle is less than 1kb small and it really couldn't be easier to set up!

How

yarn add cosha
<!-- on an img tag -->
<img src="palm-tree.jpg" alt="nice vibes" class="colorful-shadow"/>

<!-- on a picture tag -->
<picture class="colorful-shadow">
  <source srcset="palm-tree-1200.jpg 1200w, palm-tree-800.jpg 800w, palm-tree-400.jpg 400w" type="image/jpeg">
  <source srcset="palm-tree-1200.webp 1200w, palm-tree-800.webp 800w, palm-tree-400.webp 400w" type="image/webp">
  <img src="palm-tree-400.jpg" alt="nice vibes"/>
</picture>
import cosha from 'cosha';

cosha({
  className: 'colorful-shadow',
  blur: '10px',
  brightness: '125%',
  saturation: '110%',
  x: '2px',
  y: '6px'
});

Alternatively, if that module bundler stuff isn't for you, you can get it directly from https://unpkg.com/cosha.

<script src="https://unpkg.com/cosha"></script>
<script>
  cosha({ className: 'colorful-shadow' });
</script>

Config

Everything in the config is optional. You can also use it by just calling cosha(). The default values are:

cosha({
  className: 'cosha',
  blur: '5px',
  brightness: 1,
  saturation: 1,
  x: 0,
  y: 0
});

Gotcha

It runs in every browser except Internet Explorer. This is because of missing support for CSS filter properties. In case cosha detects it's running in a browser that doesn't have NodeList.prototype.forEach available, which at this point is only IE <= 11, it simply doesn't do anything.

License

MIT

Current Tags

  • 0.3.12                                ...           latest (19 days ago)

17 Versions

  • 0.3.12                                ...           19 days ago
  • 0.3.11                                ...           a month ago
  • 0.3.10                                ...           a month ago
  • 0.3.9                                ...           2 months ago
  • 0.3.8                                ...           2 months ago
  • 0.3.7                                ...           2 months ago
  • 0.3.6                                ...           3 months ago
  • 0.3.5                                ...           3 months ago
  • 0.3.4                                ...           3 months ago
  • 0.3.3                                ...           3 months ago
  • 0.3.2                                ...           3 months ago
  • 0.3.1                                ...           3 months ago
  • 0.3.0                                ...           3 months ago
  • 0.2.0                                ...           9 months ago
  • 0.1.4                                ...           9 months ago
  • 0.1.3                                ...           9 months ago
  • 0.1.2                                ...           9 months ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 14
Last Day 0
Last Week 0
Last Month 19
Dependencies (0)
None
Dev Dependencies (11)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |