JavaScript Library For Colorful Shadows for Your Images | cosha

Cosha lets you add colorful shades to your photos and this JavaScript library applies colored shadows to an image by cloning, blurring, and positioning the image behind the original image.

How to make use of it:

1. Install and import the Cosha as an ES module.

# Yarn
$ yarn add cosha

# NPM
$ npm i cosha --save
import cosha from 'cosha';

2. Or load the compiled JavaScript within the doc.

<script src="cosha.iife.js"></script>

3. Apply the Cosha to the picture inside the doc.

cosha({
  className: 'has-shadow'
});
// Add Image Here
<picture class="has-shadow">
  <source srcset="1.jpg 1200w, 1-800.jpg 800w, 1-400.jpg 400w" type="image/jpeg">
  <source srcset="1.webp 1200w, 1-800.webp 800w, 1-400.webp 400w" type="image/webp">
  // Add Image Here
</picture>

4. Customize the blur, brightness, and saturate filter capabilities.

cosha({
  className: 'has-shadow',
  blur: '5px',
  brightness: '125%',
  saturation: '110%'
});

5. Set the shadow size. Default: 0.

cosha({
  className: 'has-shadow',
  x: '5px',
  y: '5px'
});

Colorful & Blurred Shadows For Images, cosha Plugin/Github


See Demo And Download

Official Website(robinloeffel): Click Here

This superior jQuery/javascript plugin is developed by robinloeffel. For extra Advanced usage, please go to the official website.

Share