Stripe Gradient is a very easy-to-implement and lightweight JavaScript plugin that creates smooth gradient background animation on a Canvas element. Just follow the steps below and create your own gradient animation.
1. Include the Javascript stripe-gradient.js
at the bottom of the web page.
<script src="js/stripe-gradient.js"></script>
2. Add the basic HTML to the page.
<canvas id="demo"></canvas>
3. Initialize the plugin and we're ready to go.
(function() {
'use strict';
new Gradient({
canvas: 'canvas#demo',
colors: ['#a960ee', '#ff333d', '#90e0ff', '#ffcb57']
});
})();
<canvas id="demo"></canvas>
(function() {
'use strict';
new Gradient({
canvas: 'canvas#demo',
colors: ['#a960ee', '#ff333d', '#90e0ff', '#ffcb57']
});
})();