We programmers are constantly looking for new and more interesting tools with which to become more productive or to add them to our new project. Today's list will be made up of cool tools and projects that are both creative and educational, based on interesting algorithms and rules.
1. img2css
This is a tool that can convert any image into a pure CSS image.
- Looking for a programmatic way to do this? See https://github.com/javierbyte/canvas-image-utils
Demo
Github
2. Pintr
Turn your images into plotter-like line drawings, create single line SVG illustrations from your pictures.
All the processing is made locally, your images never leave your computer and you are free to use them as you please.
Examples
Online Demo
Github
3. Color Thief
Grab the color palette from an image using just Javascript.Works in the browser and in Node.
Online Demo
Github
4. Infinite Tubes
A tunnel experiment in WebGL inspired by the effect seen on the http://www.fornasetti.com/ website. By Louis Hoebregts.
Online Demo
Github
5. JS Paint
A pixel-perfect web-based MS Paint remake and more...
JS Paint recreates every tool and menu of MS Paint, and even little-known features, to a high degree of fidelity.
It supports themes, additional file types, and accessibility features like Eye Gaze Mode and Speech Recognition.
Ah yes, good old Paint. Not the one with the ribbons or the new skeuomorphic one with the interface that can take up nearly half the screen. (And not the even newer Paint 3D.)
Windows 95, 98, and XP were the golden years of Paint. You had a tool box and a color box, a foreground color and a background color, and that was all you needed.
Things were simple.
Online Demo
Github
6. NDWFC
A Wave Function Collapse implementation with infinite canvas in arbitrary number of dimensions.
Based on the algorithm of the original Wave Function Collapse.
- For the browser and node.js
- Works with web worker multithreading
- Infinitely expandable canvas
- 2D/3D/ND
Online Demo
Github
7. Fishdraw
procedurally generated fish drawings
- generates all sorts of weird fishes
- outputs polylines (supported format svg, json, csv, etc.)
- full procedural generation, single file no dependencies
- plotter-centric
- export drawing animation:
Online Demo
Github
8. Visual Center
Tool that will find the visual center of your images / logos.
It calculates a visual weight value for every pixel on the image: the square root of the difference between that pixel and the background color. And then the algorithm tries to balance that weight in all directions.