Skip to content

jonnydubowsky/animated-pixel-gradients

 
 

Repository files navigation

animated-pixel-gradients

Make pixelated gradient GIFs with words on them!

Screenshot of app running

Example GIF

Sample GIF with a purple and green gradient with the word "GRADIENT" in the middle

Live version on Glitch 🎏

Fork on GitHub

Install from GitHub

git clone https://github.com/noahleigh/animated-pixel-gradients.git
cd animated-pixel-gradients
npm install

Run locally

npm start

Open http://localhost:PORT/ in your browser with the port that it provided (e.g. http://localhost:8080/)

Libraries used

  • MainLoop.js - Runs the update-draw loop for the animation preview
  • gif.js - Renders the GIF file
  • opentype.js - Draws the text on the canvas
  • spectrum - Color picker for platforms that don't support <input type="color">

To Do

  • Develop Twitter bot feature

About

Make pixelated gradient GIFs with words

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 84.4%
  • HTML 11.9%
  • CSS 3.7%