How it works
A look is a theme, a kit, and a contract.
Claude Code builds sites fast and dresses them badly. A look fixes the second part without touching the first. It is a design direction decided once, locked, and handed to the assistant as rules it cannot argue with.
Three steps
1
Pick a look
Choose by mood, not effort. Every look installs the same way and comes with a live demo.
2
Pull it in
Terminalnpx bandana add gold-standard --key …3
Paste
PromptDress this site in the Gold Standard look at ./looks/gold-standard. Read its CLAUDE.md first and obey it.What is in the folder
CLAUDE.md
The instruction file. Rules, hierarchy, what never to do, when to use which section, and a paste-this prompt. It reads this before it touches a file.
theme.css and theme.json
Every colour, radius, shadow, font and spacing value the site is allowed to use, and nothing else. Once as CSS, once machine-readable.
sections/ and components/
Real HTML and CSS blocks with every state drawn, so Claude never invents one. If the site disagrees with the kit, the site is wrong.
fonts/
Open-licence faces plus one original typeface drawn for this look, self-hosted, with the licence beside them.
motion.css
Easings, durations, scroll reveals, hovers, transitions and loaders as presets. A look is never static.
demo/
One fully built example site in this look. The preview you saw, and Claude's reference.
Made by us, on purpose.
Bandana is a managed marketplace. Every look is cut in-house, held to the same contract, sold fifty times, then retired.