01
Shark tank
OPEN ↗Schools, hunts, panic, and settles. Eight sharks, five fish species.
LIVING ASCII SCENES · v0.4.0
Your interface,
but alive.
Drop a shark tank, a robot floor, a jellyfish bloom, or one very good robot dog behind your UI. Zero dependencies. One canvas.
$
npm i ascii-thingsTRY THE SCENE · click, type, or throw
01 / HABITATS
Four scenes.
One tiny runtime.
Each one is a small ecosystem, not a looped animation. Seeded, themeable, and capped so it stays fast on a real page.
02 / INTEGRATE
One install.
Anywhere you render.
React, plain HTML, Astro, Vue, Svelte, or a static page. Canvas in, life out. The host app keeps its own UI.
- Zero runtime dependencies
- ESM, tree-shakeable subpath exports
- Optional React ≥ 18 peer
- Works with your design system — or ours
import { AsciiDog } from "ascii-things/react";
export function Hero() {
return (
<AsciiDog
palette="abyss"
seed={7}
spread={[0.68, 0.68]}
label="A live ASCII robot dog test yard"
/>
);
}<script type="module"
src="https://cdn.jsdelivr.net/npm/ascii-things/dist/element.js"></script>
<ascii-dog
palette="abyss"
seed="7"
spread="0.68,0.68"
style="height: 420px"
></ascii-dog>import { createDog } from "ascii-things/dog";
const scene = createDog(canvas, {
palette: "abyss",
seed: 7,
count: 1,
spread: [0.68, 0.68],
interactive: true,
});
scene.throwBall(canvas.clientWidth * 0.55, canvas.clientHeight * 0.5);Same API in every scene. Swap the import and the options.
03 / WHY IT FEELS ALIVE
Small simulations.
Serious defaults.
Zero dependencies
One canvas, no WebGL, no image pipeline. The whole runtime is yours to read.
Deterministic
Seed the world and it plays the same way twice. Screenshot it, test it, ship it.
Themeable
Abyss, paper, neon, mono, or a palette of your own. The scene follows your ink.
Accessible defaults
Reduced motion settles the world. Decorative canvases stay out of the a11y tree.
Built for 60fps
Cell caps and adaptive columns keep 4K pages from turning into a particle furnace.
MIT, forever
Use it in a portfolio, a product, or a pitch deck. No seat counts, no watermark.
THE PRINCIPLE
Not an animation.
A habitat.
Every scene runs on its own small rules. No two loads are quite the same.