Palettes you can live inside
Most palette galleries show five colour chips and leave the rest to your imagination. That’s the hard part, though: how does a colour feel behind a long paragraph, inside a code block, on a button, or next to a particular font?
Lightbi Palettes answers that by wearing each palette. Pick one from the palette menu and this whole website, including the navigation, cards, code and footer, switches to it instantly. What you see is a real page, not a screenshot.
What every palette includes
- Eleven colour roles: background, raised surface, recessed surface, text, headings, muted text, accent, second accent, links, borders and the text colour for accent buttons.
- A font pairing: heading, body and monospace, all self-hosted.
- Contrast scores: every important colour pair is checked against the WCAG 2 accessibility guidelines when the site is built.
- Copy-ready tokens: CSS custom properties, a Tailwind CSS 4
@themeblock and JSON.
Share a palette
Add ?palette= and a palette name to any address on this site to show it in that palette without changing your saved choice. For example, /?palette=monsoon.
Built with
This site runs on Hugo and the Lightbi theme. Each palette is a single small data file, and Hugo generates the stylesheet, the palette pages and the picker from those files.