Blog
Short reads for people who pick colors under real deadlines — contrast habits, palette tricks, and what we ship on ChromaXP.
How to pick a website color scheme (without copying a Dribbble shot)
One anchor, neutrals, semantic colors, contrast checks, then export to CSS or Tailwind — five roles, not fifteen pretty swatches.
Monochromatic palettes for UI (one hue, many jobs)
Elegant on Dribbble, scary in tables — unless you have enough lightness steps from one hue family.
Android colors.xml for designers
Figma purple should land in colors.xml once — aligned with web tokens, including night overrides.
Building a neutral gray palette that is not dead on screen
Pure gray swatches look fine; pure gray apps look lifeless. Tint your ladder and stop at three text grays.
CSS box shadow colors that do not look like 2012
Neutral elevation first, tinted shadows sparingly — and rebuild tokens when dark mode flips the rules.
Warm vs cool colors in interfaces
Temperature shows up in sidebar grays and chart lines — not just posters from theory class.
Color temperature and UI mood
Warm feels cozy until dated; cool feels precise until clinical. Dial temperature on neutrals first.
CSS pattern backgrounds with two colors
Stripes and dots from pure CSS — no PNGs — if contrast behind your form still passes.
Naming colors in design systems
blue-500 for engineers, Ocean Mist for decks — two layers, one ramp, fewer wrong-hex bugs.
Using a random color generator without shipping chaos
Dice-roll hex for unblock — lock one anchor, build a ramp, do not ship rainbow dashboards.
Color mixing 101 for UI
Blends for hovers and tints — without the muddy middle when you mix in the wrong space.
OKLCH vs HSL: which should you use in CSS?
HSL for quick tweaks; OKLCH for ramps and themes — without a holy war in Slack.
Accessible button colors that still look on-brand
Fix fill, hover, and focus as a set — not just the label — so primary buttons pass audit without turning into gray mush.
CSS gradients for UI designers (without the muddy middle)
Hero bands and buttons love gradients until white text lands in the blend zone. Fewer stops, scrims, and contrast checks that stick.
How to extract colors from any image (without guessing)
Upload a screenshot, pull dominant swatches in the browser, and turn them into a palette you can ship — no Photoshop layer dance.
Color harmony for UI designers (beyond the color wheel cliché)
Complementary and triadic schemes are a starting point — not a verdict. How to use harmony when dashboards, not posters, are the deliverable.
Tailwind custom colors: extend your theme without fighting the defaults
Map brand ramps into theme.extend.colors, keep class names predictable, and stop copy-pasting hex from five different tabs.
Building a dark mode UI palette that does not glow like a neon sign
Surfaces, borders, and text need different rules at night. A practical ladder for elevated cards, muted labels, and accents that still feel on-brand.
HTML color codes explained: HEX, RGB, and HSL
What those six-character codes mean, when to use rgb() vs hsl(), and why designers and devs still argue about the same purple.
Shipping ChromaXP Phase 7
OKLCH ramps in the token exporters, gaming color references, and this blog going live — what changed and where to click first.
Design tokens in plain CSS
Custom properties, scoped themes, and keeping web, Tailwind, and Android speaking the same numbers — no monorepo required.
From one accent to a full palette
Brand hands you a single purple. Here is how to grow neutrals, secondary hues, and semantic colors without losing the plot.
WCAG contrast without living in a spreadsheet
Ratios are a guardrail, not a personality test. A lighter workflow for text on buttons, badges, and accidental gray-on-gray.
Why OKLCH belongs in UI systems
If nudging lightness in HSL turns yellow into mud while blue stays electric, you are not bad at design — you are fighting the color model.