Bluey.
Editorial calm. Composed authority. Linear meets Stratechery — powder-blue surface, vermillion accent, glass cards.
TokensREV-01
Surface + ink
Status
Typography
- Display Helvetica Neue — 700 / -0.03em
- Body Helvetica Neue — 400 / 1.5
- Mono Courier New — 0.65rem CAPS / 0.1em
Components10
The standard Wardrobe contract — Button, Input, Textarea, Select, Card, Badge, Dialog, Tabs, Switch, Toast. Bluey-styled, drop-in compatible.
Button.
Pill-shaped (50px radius). Primary is vermillion with a soft accent-glow. Secondary fills in deep ink. Ghost is a hairline border that softens on hover.
Input.
Glass field on the powder-blue surface — translucent white at 25%, hairline border. Mono CAPS label sits above. Focus deepens the surface and pulls the border to ink.
Be specific. One assumption per row.
Textarea.
Same glass treatment as Input — taller, line-height 1.5, vertical resize.
Markdown supported.
Select.
Glass field with a CSS-painted chevron. Same edges as Input so a stack of fields breathes the same.
Card.
Glass-morphism: translucent white with a 1px hairline + 10px backdrop-blur. Score variant flips to deep ink with a 3rem hero number.
Badge.
Status chip in mono Courier. Validated/needs-work/rejected map to the SaaS palette; high/med are inline metric tags.
Dialog.
Powder-blue tinted backdrop with 8px blur. The card itself is glass-strong + 20px radius. Esc + outside-click both close.
Tabs.
Hairline underline strip. Active tab is full-opacity with a vermillion 2px underbar. No animation — just the line moving as you click.
Switch.
Pebble track. Off is hairline grey. On flips to vermillion with the thumb sliding 16px right.
Toast.
Glass-strong card with a colored left border. Default is unmarked, success picks the green from validated, error picks vermillion.
Like the calm?
Drop your email — get the next theme + occasional builder notes.
No spam. ~1 email per theme drop. Maybe one extra when I ship something interesting.