Granim

granim

Create fluid and interactive gradients animations.

Zero dependencies,< 10 kB fun module that helps us to do some cool gradient animations!

Get it: npm install granim --save

Sample usage:

1
2

<!-- Create a <canvas> element -->
<canvas id="granim-canvas"></canvas>

1
2
3
4
5
6
7
8
9
10
11
12
13
14

var granimInstance = new Granim({
   element: '#granim-canvas',
   name: 'granim',
   opacity: [1, 1],
   states : {
       "default-state": {
           gradients: [
               ['#834D9B', '#D04ED6'],
               ['#1CD8D2', '#93EDC7']
           ]
       }
   }
});
</script>

P.S: Don't miss to read their extensive API

GIF FTW!

granim

Suggest a module

Comments