Convert any image to pure CSS.
JavaScript HTML CSS
Latest commit eb01417 Jul 21, 2016 Javier Bórquez Clean index.html


This is a tool that can convert any image into a pure css image.

Live demo


How does it works?

Well, it just puts the image in a canvas, calculates an array with the rgb values, and then... creates a single pixel shadow for each value!


Hum... to demonstrate the power of CSS!

And this may have other interesting properties, like creating loading screens with pixel art or pixel-level animation.

Planned features

  • Make the result smaller with smarter shadows and common background detection. (In progress)
  • Make animation and image morphing by using css transitions on the shadows. (In progress)
  • Add scale options to better suport pixel art.
  • Support for custom image filters.


Run development server: npm start