https://github.com/karolsw3/gradientify
Create beautiful, animated gradients with ease. This JS library provides you with an easy-to-use API to create and put animated gradients wherever you want on your website.
https://github.com/karolsw3/gradientify
animated animated-backgrounds animated-gradients gradient gradients javascript-library
Last synced: 6 months ago
JSON representation
Create beautiful, animated gradients with ease. This JS library provides you with an easy-to-use API to create and put animated gradients wherever you want on your website.
- Host: GitHub
- URL: https://github.com/karolsw3/gradientify
- Owner: karolsw3
- License: mit
- Created: 2018-02-22T13:03:18.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2022-12-01T23:13:27.000Z (almost 3 years ago)
- Last Synced: 2025-03-22T20:17:09.681Z (7 months ago)
- Topics: animated, animated-backgrounds, animated-gradients, gradient, gradients, javascript-library
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/gradientify
- Size: 2.29 MB
- Stars: 29
- Watchers: 2
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Create beautiful, animated gradients with ease.
Ever wanted to animate a gradient background, but CSS transitions disappointed you with their lack of this in-extremely-high-demand functionality? Worry no more!
## Installation
For wizards:
```
npm i gradientify
```
For less-experienced wizards:
```html
```
## Usage
```javascript
let gradientify = new Gradientify(
'.yourClass',
[
"linear-gradient(60deg, rgb(255, 0, 0), rgb(0, 0, 255))", // Array of CSS gradients
"linear-gradient(10deg, rgb(25, 123, 23), #ff22af)",
"radial-gradient(rgb(25, 123, 223), red)"
],
3000 // Fading interval in miliseconds
)
```