A calm guide to meditation, built to see how far design can go with AI.
I wanted to test something: if AI does the building, how far can I push the design? So I picked a simple topic, meditation, and put all my energy into taste: the look, the feel, the motion. I didn't write the code line by line. I directed it, reacting to what I saw and asking for changes until it felt calm.
No framework and no build step: plain HTML, CSS and JavaScript. The 3D body is the centrepiece, and nothing you type is sent anywhere, because the matching runs in your browser.
The build
Claude Code + Codex
Built entirely through conversation. I directed, the agents wrote the code.
The body
MakeHuman + Three.js
An open-source 3D body, with the arms re-posed in code so the figure looks relaxed.
The glass
Custom shader
Edges glow like light on glass, and the body is drawn twice so it reads as one clean shell.
The matching
Keyword scoring
Your words are matched to feelings and practices right in the browser. No AI call, nothing sent.
The content
One data file
Every meditation, chakra, plan and video lives in one file, so the site can grow without touching the layout.
Going live
Vercel
Every font, image and library is bundled, with strict security headers and no accounts or tracking.
Type how you feel in your own words, like "I can't stop overthinking", and it suggests a meditation that fits. It also lights up where that feeling may sit in your body, on a glass-like 3D figure you can turn, zoom and tap. There are 14 meditations, each with its history, what it helps with, how to do it, and guided videos. There's a page for each of the seven chakras, and a four-week plan for beginners, intermediate and advanced.
One honest request at a time. "I really hate the design" turned a flat beige first version into soft gradients and frosted glass, from two reference images I shared. "Less skeleton, I want to turn the body" became the 3D figure. "The hands are too far from the body" re-posed the arms. "I don't want the text in a box" made the pages editorial. I picked between side-by-side mocks, and kept refining until it felt calm.
Chakras are a traditional framework, not a medical diagnosis, and the site says so plainly. If what you type sounds like suicide or self-harm, said directly or indirectly ("I don't want to be here anymore"), it shows the 988 crisis line above the meditations. Heavy words like "I hate myself" get a gentler note with the same number. It's a word list, so it's set to show too often rather than miss someone.
Click to enlarge