Color palette
Pick one color. You get an 11-step scale, contrast checks, harmonies and code for Tailwind or plain CSS.
Base color
Scale
Click a swatch to copy its hex.Preview
Weekly report
NewRevenue is up 12% compared to last week. Three invoices are waiting for approval.
Your trial ends in 3 days.
Storage used68%
Harmonies
- Complementary
- Analogous
- Triadic
- Split complementary
Export
@theme {
--color-brand-50: #fef4f4;
--color-brand-100: #fee2e0;
--color-brand-200: #fec3c0;
--color-brand-300: #fe9592;
--color-brand-400: #ff3347;
--color-brand-500: #ec1437;
--color-brand-600: #c5012a;
--color-brand-700: #9d0320;
--color-brand-800: #7c0016;
--color-brand-900: #58000d;
--color-brand-950: #360005;
}