Signal
Loud outside. Cold inside.
50 of 50 left · retired when gonePalette
Canvas & version
- Canvas
- Light
- Version
- 0.9.2
A billboard bolted to an instrument panel. Poster-scale condensed type on a full-bleed signal field for anything public; the same tokens, quiet and dense, for anything logged in. One system, one attribute apart: set a surface on any container and everything inside re-tunes to paper, ink or signal. Two materials, the plate that sits up out of the canvas and the press pushed into it, and the press is the only way anything is ever selected.
Four values are the whole palette: ink, paper, signal, and signal deep. Status is carried by weight and material, never by hue. The signal surface is a moment, not a mode, once per page at most. Twelve pill-built instrument legends for icons. Surfaces cut on a hard switch and headlines jam in line by line from loose leading.
It refuses: a fifth colour, a third material, a second signal surface on a page, two primaries on one screen, display type under 2rem, a number in the display face, a dark or on-accent component variant, a fade where a cut will do, a gradient on text, and a second icon set.
What's inside
folderlooks/signal/
├── CLAUDE.md ← read this first
├── theme.css all tokens as CSS variables
├── theme.json same tokens, machine-readable
├── fonts/ .woff2 + LICENSE.txt
├── sections/ hero, pricing, footer …
├── components/ buttons, forms …
├── motion.css easings, keyframes, reveals
├── assets/ icons, favicon
├── kit/ the kit sheet, everything on one page
├── demo/ one page wearing the look
└── README.md install + licenceSections · 2 variants each
Components · every state drawn
Motion · baked into this look
Font pack
Anton · Inter Tight
undecided · open-licence companions · .woff2 self-hosted · LICENSE.txt included
Install
1 · Pull it in
Download the zip and unzip into your project as ./looks/signal, or run the command below.
Terminalnpx bandana add signal --key <your key>2 · Paste into Claude Code
PromptDress this site in the Signal look at ./looks/signal. Read ./looks/signal/CLAUDE.md first and obey it. Put data-look="signal" on <html>, link theme.css then motion.css, add the icon sprite and the reveal script from the kit, and build every screen from the fragments in sections/ and components/. Never invent a colour, shadow, radius, font, size or motion; if a token, section or component you need does not exist, stop and tell me instead.3 · Everything matches
Every screen Claude builds from now on comes out looking like the kit sheet.