SVG demos you can play with right now
Dozens of SVG demos, each running live on its creator's own site: some of them vibe-coded with AI, all of them playable in your browser with nothing to install. Press a card to play one on its own page, or start the cruise to ride through them one after another.
SVG is the web's vector image format: shapes described as maths, so they stay sharp at any size and can be styled and animated like the rest of a page. These projects use it for games, animated drawings, generators and interactive diagrams.
Made one of these? See how many people played yours → or use email
ink quest
A single hand-inked scene and one choice that decides how it ends — a tiny illustrated vignette drawn entirely in SVG line art. You arrive…
krbn web
A web app for Krbn, Valeriu Paloș's engine for pencil-style line drawings. The app is a single HTML file: load an STL or OBJ model, adjust…
bitmap
A generator of two-color bitmap images. Every generation is unique: the image is defined by a short seed, and the same link always opens…
ashen throne
以下表格由 node scripts/gen-docs.mjs 从 src/data.js 自动生成，改了数值后重新跑一次即可保持同步。 小技巧：在浏览器控制台里可以直接调试，比如 UI.startRun('mage'); UI.startCombat('boss'…
karesansui
从 ● 处按住拖动，把每一格白砂都耙过一遍。一笔到底，不能回头，石头只能绕着走；有 ○ 的庭，最后一步必须停在 ○。解出来的那一刻，砂纹本身就是奖励：每一关的终局都是一座真的耙好的庭。 Press on ● and drag to rake every square of…
plaza aeterna
A single HTML file, zero-dependency, zero-network vaporwave dreamscape. Open it and the mall is already open, the sun is already setting…
bean baron
Кофейная idle-игра: вырасти империю из одного кустика в горах Далата. A cozy idle clicker set on a coffee farm in Da Lat, Vietnam. Одна…
snakes and ladders arena
▶️ Play in your browser (GitHub Pages) — then click “Click to start the arena” to unlock audio and watch it auto-play. ▶️ Watch the promo…
landscape vault
Archival procedural Chinese landscape scroll synthesis engine, Shan Shui (山水画) vector plate repository, and topographical telemetry system…
flower vault
A procedural botanical synthesis engine and taxonomic archival vault designed for technical minimalism, structural honesty, and traditional…
fish vault
A digital synthesis engine and taxonomic archival repository designed for technical minimalism, structural honesty, and procedural biology…
shape grid
Interactive generative design project using p5.js
spectrum chisel
See sound as a rainbow. Try the live instrument at studio.spectrum-chisel.tak3.jp — guide and docs at spectrum-chisel.tak3.jp. This project…
VirtualPlotter
A 3D pen-plotter simulator in the browser. Drop in an SVG and watch a little AxiDraw-style machine draw it on virtual paper — arm sliding…
chladni simulator
Interactive browser-based Chladni figure simulator. No installation, no dependencies — open the HTML file and it runs. Chladni figures are…
heliograph
A fictional solar observatory in one HTML file: every visual drawn at runtime, no images, no build step. HELIOGRAPH is the Institute of…▶ 3 plays this week
somewhere
Procedurally generated watercolor paintings of places that feel familiar. Every painting is a new building, designed from the architectural…
verdant
A quiet botanical demo: a stem grows, ten leaves sprout and unfurl, and a breeze moves them through damped springs. The plant fades back to…
Kala Indian Art
कला · Kalā means art. काल · Kāla means time. This project brings the two together: three interactive websites that explore Indian art in…
tesselate
A drawing table for tessellated patterns. You draw on one tile — a square, a hexagon or a triangle; the plane around it repeats that tile…
tendril garden
Deterministic generative line drawings grown through collision-aware spatial rules.
diamonds dress up
A build-your-own dress-up doll game. Name her, then style her hair, makeup, earrings, headwear, a tiara, sparkles, a dress, a bag, and…Vibe-coded
moonlings
Raise a family of moons around your planet. Feed them, grow them, collect them all. A cozy, idle-friendly, gently physics-flavoured…
profile art
The animated images on my GitHub profile, github.com/behi22. Every image is redrawn every hour from live data: the real time and sky over…
memory garden
A card-matching memory game that runs entirely in the browser. Two people can play on the same screen, or one person can play against a…
esviji
This game came out of my mind 20 years ago thanks to the great platform that were HP 48 calculators (I've had 3 of them). I loved playing…
ECAMS.js
This is a small web application written in JavaScript for generating line-based images of Elementary Cellular Automata using Marching…
shader svg
An animated WebGL mesh-gradient "ghost" rendered inside an SVG silhouette — built with Next.js 15, @paper-design/shaders-react, and Framer…
kar tanesi
Her metinden kendine özgü bir kar tanesi üretir. Adını yaz, kar tanen çıksın; SVG ya da PNG olarak indir. → Kendi kar taneni üret Yazdığın…
SVG Parametriser
Convert SVG paths from Adobe Illustrator to parametric p5.js/Processing code with full transform control. Check out the demo here…
indian art form
21LEM301T Indian Art Form · CLA-I · SRM Institute of Science and Technology Three interactive projects on Indian art, in one repository…
artful drawing
A free drawing studio that runs in your browser. Follow a guided drawing step by step, doodle with a pen that draws in perfect symmetry…
sigiriya
A four-minute animated film, with subtitles, about the rise and fall of King Kashyapa I and his fortress on Sigiriya rock in Sri Lanka…
image lines
Browser port of cfloutier/image_lines, a Processing sketch that converts an image into a line drawing: parallel lines, concentric circles…
photo to svg
拖一张图进去就出 SVG 和回放网页 · 无需安装 · 图片不上传（全在你浏览器里算） 不是简单的"图片转矢量"——它模拟人的作画顺序：先勾线稿 → 再铺大色块 → 最后抠细节， 每一步都按"视觉重量"分配时间，大笔慢慢铺、小笔快带过，像看一段绘画录像。 建立在…
habitat
A procedurally animated robot that lives on a web page. Jointed SVG rig, spring physics, and a small state machine that decides what he…
Vellum
An atelier of imaginary cartography. Vellum lives at . No install, no account: the whole engine runs client-side in your browser. Vellum…
map game
An interactive, high-performance, and secure geographic map placement game built using Rust, WebAssembly (WASM), and native…
mona lisa svg study
在线查看： 滚轮缩放 · 拖拽平移 · 双击放大 —— 远看成画，近看笔触。访客无需登录。 本仓库托管《蒙娜丽莎》纯 SVG 研究性复刻的公网展示页，由 GitHub Pages 静态托管（免费、自带 SSL）： 主文件：mona_lisa_vector_study.svg…
FridgePatrol
An interactive cartoon refrigerator guarded by one very small, very serious night-shift employee. Open the refrigerator by clicking…
nostalgia gh banner
Nostalgia Github Banner is a web app for generating customizable, animated SVGs. Designed for easy integration into projects, available…
polkadot
Deterministic generative placeholder images from a seed string. Zero dependencies, no network, no stored assets — the same seed always…
iconizer
★ Netscape Now! · best viewed at 800×600 ★ Upload a picture and an SVG icon. Iconizer renders the picture as a photomosaic where every grid…
rad lines
This tool has moved! Rad Lines is now hosted at drawingbots.com/tools/rad-lines. The old GitHub Pages URL (msurguy.github.io/rad-lines) now…
veilforge studio
A procedural background generator for the web. Six generators, one parameter model, four export targets — and a verification harness that…
Glyphka
Geometric lettering. Expressive symbols. Forms you can make your own. Glyphka is a free, open-source studio for generating geometric…
heerich
A tiny engine for 3D voxel scenes rendered to SVG. Build shapes with CSG-like boolean operations, style individual faces, and output crisp…
design database
Interaction, motion and material studies for the web. Small, self-contained components with live demos, documented props, and notes on how…
Questions about svg
Why make a game in SVG instead of canvas?
Every shape is a real element you can click, style with CSS and inspect, which suits board games, puzzles and diagrams. Canvas wins when thousands of things move at once.
Will these look sharp on my screen?
Yes. Vector graphics are drawn at your screen's resolution, so they never blur when you zoom or go full screen.
Can I see the SVG behind one?
Usually. Open your browser's inspector on the demo, or follow the source link on its project page.