All Projects → sarcadass → Granim.js

sarcadass / Granim.js

Licence: mit
Create fluid and interactive gradient animations with this small javascript library.

Programming Languages

javascript
184084 projects - #8 most used programming language
HTML
75241 projects

Projects that are alternatives of or similar to Granim.js

euler-fluid-cpp
Euler fluid simulated with CPP and SFML
Stars: ✭ 50 (-98.96%)
Mutual labels:  fluid
Gradientprogressbar
📊 A customizable gradient progress bar (UIProgressView).
Stars: ✭ 311 (-93.55%)
Mutual labels:  gradient
Pbd Fluid In Unity
A PBD fluid in unity running on the GPU
Stars: ✭ 350 (-92.75%)
Mutual labels:  fluid
Fluidframework
Library for building distributed, real-time collaborative web applications
Stars: ✭ 3,592 (-25.55%)
Mutual labels:  fluid
Co.revely.gradient
An Android library for easy gradient management
Stars: ✭ 298 (-93.82%)
Mutual labels:  gradient
Hue
🎨 Hue is the all-in-one coloring utility that you'll ever need.
Stars: ✭ 3,306 (-31.48%)
Mutual labels:  gradient
elm-color-extra
🎨 Additional color handling for Elm
Stars: ✭ 28 (-99.42%)
Mutual labels:  gradient
Gradient String
🌈 Beautiful color gradients in terminal output
Stars: ✭ 476 (-90.13%)
Mutual labels:  gradient
Flutter programs
Experiments with Mobile
Stars: ✭ 308 (-93.62%)
Mutual labels:  gradient
Rainbow
🌈 A fluent way to apply gradations and tinting for Android.
Stars: ✭ 338 (-92.99%)
Mutual labels:  gradient
Skeletonui
☠️ Elegant skeleton loading animation in SwiftUI and Combine
Stars: ✭ 275 (-94.3%)
Mutual labels:  gradient
Skeleton
Skeleton Android
Stars: ✭ 293 (-93.93%)
Mutual labels:  gradient
Coolhue
Coolest Gradient Hues and Swatches
Stars: ✭ 3,307 (-31.46%)
Mutual labels:  gradient
Svgwave
🌊 SVG Wave is a tiny, free and beautiful SVG gradient waves generator for your UI or website desgin. It offers dead simple UI to customize, and style your waves based on your theme specifications.
Stars: ✭ 255 (-94.72%)
Mutual labels:  gradient
Enzyme
High-performance automatic differentiation of LLVM.
Stars: ✭ 418 (-91.34%)
Mutual labels:  gradient
Cirque
An iOS component that enables you to draw multi color circle strokes with gradient trasitions between colors
Stars: ✭ 23 (-99.52%)
Mutual labels:  gradient
Fitty
✨ Makes text fit perfectly
Stars: ✭ 3,321 (-31.17%)
Mutual labels:  fluid
Tutoshowcase
A simple and Elegant Showcase view for Android
Stars: ✭ 499 (-89.66%)
Mutual labels:  fluid
Chromatic Sketch
Sketch plugin for creating good-looking and perceptually uniform gradients and color scales.
Stars: ✭ 445 (-90.78%)
Mutual labels:  gradient
Pastel
🎨 Gradient animation effect like Instagram
Stars: ✭ 3,355 (-30.47%)
Mutual labels:  gradient

Granim.js Build Status codecov gitter

Create fluid and interactive gradient animations with this small javascript library.

See the demo site.

Install

From NPM

  • Run npm install granim --save

From Bower

  • Run bower install granim

Static

How to use

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

<!-- Call the script -->
<script src="granim.min.js"></script>

<!-- Create a Granim instance -->
<script>
var granimInstance = new Granim({
   element: '#granim-canvas',
   name: 'granim',
   opacity: [1, 1],
   states : {
       "default-state": {
           gradients: [
               ['#834D9B', '#D04ED6'],
               ['#1CD8D2', '#93EDC7']
           ]
       }
   }
});
</script>
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].