Vibe Coded Open Source

A collection of 21 public projects for making art, exploring geometry, building interfaces, and creating motion on the web.

Six project interfaces showing watercolor painting, vector geometry, generative backgrounds, and animation tools.

Ideas you can open and explore

Creative tools, visual experiments, and reusable libraries from my public GitHub repositories. This collection brings together 21 projects with repository updates during 2024–2026, including older work I continued to develop alongside newer experiments. Ports and adaptations are credited in their descriptions.

Explore the working demos, browse the source, or use the projects as starting points for your own experiments. Screenshots show hosted examples and existing project artwork; some tools are now part of DrawingBots.

Collection checked October 11, 2026.

Project index

Brushmark

Animated graphite, marker, watercolor, and other brush annotations over selectable web text. The library combines painterly rendering with responsive text geometry and configurable animation timing.

Source on GitHub · Explore the demo

Hand-painted underlines and circles annotate the Brushmark demonstration page.

Hand-painted underlines and circles annotate the Brushmark demonstration page. Select the image for a larger view.

Cavalier Contours JS

A TypeScript port of the Cavalier Contours Rust library for offsetting polylines and combining shapes, including curved arc segments. Its interactive playground makes geometric operations visible and editable.

Source on GitHub · Explore the demo

Repeated offsets around an arc-based polyline in the Cavalier Contours playground.

Repeated offsets around an arc-based polyline in the Cavalier Contours playground. Select the image for a larger view.

CNC Text Tool

Compose single-stroke lettering for pen plotters, engraving, and CNC workflows. Now hosted as Plotter Text on DrawingBots, it supports text layers, spacing, alignment, and SVG export.

Source on GitHub · Explore the demo

Single-stroke lettering laid out over generative line artwork.

Single-stroke lettering laid out over generative line artwork. Shown on DrawingBots. Select the image for a larger view.

Dot Printer Studio

A visual editor and player for dot-matrix animations, with drawing tools, connections, and a multi-frame timeline. Editable animation files can be played in React or vanilla JavaScript applications.

Source on GitHub · Explore the demo

The Digital Physical preset loaded into the dot-matrix editor and three-frame timeline.

The Digital Physical preset loaded into the dot-matrix editor and three-frame timeline. Select the image for a larger view.

Draw Presenter

A presentation system that draws letters, brush annotations, and diagrams stroke by stroke. A visual editor works with plain React files, while shader transitions connect the slides.

Source on GitHub · Explore the demo

The opening slide of the Draw Presenter demonstration deck.

The opening slide of the Draw Presenter demonstration deck. Select the image for a larger view.

Egg SVG Visualizer

Preview how an SVG design wraps around a three-dimensional egg before using a drawing robot. Adjust the egg shape, artwork placement, opacity, and projection settings in real time.

Source on GitHub · Explore the demo

Blue nested polygon artwork projected around a three-dimensional egg.

Blue nested polygon artwork projected around a three-dimensional egg. Select the image for a larger view.

Flow Lines

Turn mathematical vector fields into flowing SVG line artwork. Tune integration and spacing, save favorite results, and export paths for pen plotting.

Source on GitHub · Explore the demo

Streamlines generated from a mathematical vector field.

Streamlines generated from a mathematical vector field. Shown on DrawingBots. Select the image for a larger view.

Genuary Boolean Algebra

Combine procedural patterns with AND, OR, XOR, and NOT operations to create animated, layered sculptures. The browser interface exposes pattern, threshold, and three-dimensional rendering controls.

Source on GitHub · Explore the demo

Two noise patterns combined with XOR into a purple layered sculpture.

Two noise patterns combined with XOR into a purple layered sculpture. Select the image for a larger view.

GIF Loop Coder

My modernization and standalone packaging of Keith Peters’ GIF Loop Coder animation library. A browser playground pairs code, a live preview, examples, and exports to GIF, video, and still images.

Source on GitHub · Explore the demo

A live code editor beside an animated star and circle in GIF Loop Coder.

A live code editor beside an animated star and circle in GIF Loop Coder. Select the image for a larger view.

Mosaic JS

A browser port of Jim Bumgardner’s qd_mosaic approach that reconstructs pictures from Quick, Draw! doodles. Match drawings to image tones and export the mosaic as a pen-plotter-ready SVG.

Source on GitHub · Explore the demo

A photograph reconstructed from doodles in the DrawingBots version of the tool.

A photograph reconstructed from doodles in the DrawingBots version of the tool. Shown on DrawingBots. Select the image for a larger view.

Plotter SVG Preview

Preview SVG drawings on simulated paper before plotting or printing. Paper texture, lighting, physical dimensions, and ruler overlays help explore the finished result.

Source on GitHub · Explore the demo

SVG line artwork previewed on a realistic sheet of paper.

SVG line artwork previewed on a realistic sheet of paper. Shown on DrawingBots. Select the image for a larger view.

Plotter Workshop — Electric Sea 2026

Workshop materials and interactive examples for learning procedural vector art. The collection includes plotter-ready sketches, visual explainers, slides, and audio, face, and hand-tracking tools.

Source on GitHub · Explore the demo

The workshop Polygon Spirograph example with controls and rendered vector artwork.

The workshop Polygon Spirograph example with controls and rendered vector artwork. Select the image for a larger view.

Plotterfun Extended

An expanded version of mitxela’s Plotterfun for turning photographs into SVG line art. It adds a modern interface, more plotting algorithms, color separation, and depth-aware workflows.

Source on GitHub · Explore the demo

A sample photograph converted into plotter line art in the DrawingBots version.

A sample photograph converted into plotter line art in the DrawingBots version. Shown on DrawingBots. Select the image for a larger view.

Rad Lines

Generate geometric SVG patterns from repeated shapes, scale changes, and rotation formulas. Export vector artwork for pen plotters, CNC machines, or laser cutters.

Source on GitHub · Explore the demo

Nested pentagons generated with scale and rotation formulas.

Nested pentagons generated with scale and rotation formulas. Shown on DrawingBots. Select the image for a larger view.

Squircle Path Kit

Generate SVG paths with Figma-style corner rounding and smoothing for rectangles and arbitrary polygons. Interactive examples cover per-corner controls, clipping, and integration into interfaces.

Source on GitHub · Explore the demo

Squircle documentation and playground showing rounded rectangles and polygon examples.

Squircle documentation and playground showing rounded rectangles and polygon examples. Select the image for a larger view.

Streamline Loops

Trace formula-defined three-dimensional vector fields into tubes or ribbons. Explore presets, rendering effects, and seamless camera-orbit loops for motion graphics.

Source on GitHub · Explore the demo

The Curl Vortex Disc preset rendered as a three-dimensional bundle of streamlines.

The Curl Vortex Disc preset rendered as a three-dimensional bundle of streamlines. Select the image for a larger view.

Stroke Font Studio

Create and edit single-stroke SVG fonts for plotting, engraving, and CNC work. The editor includes glyph drawing, Bézier controls, tracing references, kerning, and a live text preview.

Source on GitHub · Explore the demo

A single-stroke glyph editor with a live lettering preview.

A single-stroke glyph editor with a live lettering preview. Shown on DrawingBots. Select the image for a larger view.

SVG Cropper Tool

Crop vector artwork directly in the browser and export the resulting SVG paths. The tool is now hosted in the DrawingBots collection for preparing plotter artwork.

Source on GitHub · Explore the demo

A circular crop applied to flowing SVG line artwork.

A circular crop applied to flowing SVG line artwork. Shown on DrawingBots. Select the image for a larger view.

Trail Studio

Turn images or text into animated trails using motion paths, color palettes, and fading buffers. Export still frames, WebM animations, or settings for a lightweight fullscreen player.

Source on GitHub · Explore the demo

The word CREATE rendered in Trail Studio with its motion and palette controls.

The word CREATE rendered in Trail Studio with its motion and palette controls. Select the image for a larger view.

Triangles

A library and playground for seeded Delaunay backgrounds with shaded triangular surfaces. Adjust the mesh and lighting, switch renderers, and export raster or SVG artwork.

Source on GitHub · Explore the demo

A shaded triangular background behind sample text beside the Triangles configurator.

A shaded triangular background behind sample text beside the Triangles configurator. Select the image for a larger view.

Watercolor Playground

Paint in the browser with flowing washes, pigment mixing, textured paper, and a varied brush library. Drawing, text, shapes, and fill tools combine with wet-paper behavior to create watercolor illustrations.

Source on GitHub · Explore the demo

A watercolor landscape with blue sky, a violet horizon, fields, and trees, painted in the app.

A watercolor landscape with blue sky, a violet horizon, fields, and trees, painted in the app. Screenshot from the project README. Select the image for a larger view.