https://github.com/collidingscopes/video-to-pixel-art

Turn videos into pixel art in real-time using javascript, webgl, and html canvas
https://github.com/collidingscopes/video-to-pixel-art

art dither dithering edge-detection filter free html-canvas image-processing javascript live open-source pixel pixel-art video video-filter video-processing video-to-pixel-art webgl

Last synced: 18 days ago
JSON representation

Turn videos into pixel art in real-time using javascript, webgl, and html canvas

• Host: GitHub
• URL: https://github.com/collidingscopes/video-to-pixel-art
• Owner: collidingScopes
• License: mit
• Created: 2024-12-11T07:40:24.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-12-15T09:55:13.000Z (5 months ago)
• Last Synced: 2025-04-12T05:14:48.461Z (18 days ago)
• Topics: art, dither, dithering, edge-detection, filter, free, html-canvas, image-processing, javascript, live, open-source, pixel, pixel-art, video, video-filter, video-processing, video-to-pixel-art, webgl
• Language: JavaScript
• Homepage: https://collidingscopes.github.io/video-to-pixel-art/
• Size: 11.3 MB
• Stars: 20
• Watchers: 1
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.MD
  • License: LICENSE.txt

Awesome Lists containing this project

README

        
Video-to-Pixel-Art

=====

Turn videos into pixel art! Use your webcam feed or upload a video, then use the controls to adjust the aesthetic:



  
Color palette

  
Pixel size

  
Dithering strength -- based on the Bayer dithering algorithm

  
Edge detection strength and color -- based on Sobel edge detection



Live demo: https://collidingscopes.github.io/video-to-pixel-art/



All processing is done in real-time within your browser, using javascript / webgl shaders / html canvas.

You can export your creations as images or videos to save / share your work.

This tool is completely free, open source (MIT license), without any paywalls or premium options. You are welcome to use it for personal or commercial purposes.

If you found this tool useful, feel free to buy me a coffee. This would be much appreciated during late-night coding sessions!




If the video export feature does not work for you, please try a free screen-recording tool such as OBS Studio.

I do not have access to any of the videos that you upload here, as all processing is done "client-side" (i.e., no videos or images are saved/stored by me — they stay on your computer only).

If you enjoyed this, you may be interested in my other free / open source art projects:





Video-to-ASCII: turn videos into ASCII pixel art



Shape Shimmer: turn photos into funky wave animations



Colliding Scopes: turn photos into kaleidoscope animations



Force-Field Animation: turn photos into particle animations



Feel free to reach out to discuss, ask questions, or to share your creations! The animations can be easily uploaded to instagram or otherwise -- you can tag me @stereo.drift :)


License

=======

This is an open source project provided under an MIT license