Skip to content
A graphical CSS3 animation tool
JavaScript HTML CSS
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
.gitignore Remove font files from source. Jan 28, 2015
bower.json Tag 2.5.5 Jun 10, 2016
package.json Tag 2.5.5 Jun 10, 2016

Stylie - A CSS 3 animation tool

Code Climate

Stylie is a fun tool for easily creating CSS 3 animations. Quickly design your animation graphically, grab the generated CSS and go! To learn how to use the app, either run it locally (see below) or go to and click the "?" icon in the header for a manual.

Install locally


Clone this repo and install the dependencies:

npm install && bower install

To run the app:

grunt serve

You can now access Stylie from http://localhost:9000.

Developing Stylie

You can build the project with:

grunt build

And test the optimized build locally with:

grunt serve:dist


I can't design things, but I know people that can. The overall look of the app is courtesy of Jon Victorino. The Help icon was masterfully crafted by @nrrrdcore.


Stylie is distributed under a CC BY-NC-SA license. Don't worry, this license does not extend to the animations you create with Stylie, just the application itself. You are free to use the animations created by Stylie however you please. You are encouraged to use and modify the code to suit your needs, as well as redistribute it non-commercially.

Something went wrong with that request. Please try again.