Colors

Palettes, tints and color scales that stay readable and fit your design system.

Color Palette Generator
Harmonious color palettes at the press of the space bar. Lock colors, pick a harmony, check contrast and export as CSS.
Open in editor
Tints & Shades
Lighter and darker steps of a color. Export as HEX, RGB, HSL or CSS variables.
Open in editor
Tailwind Color Palette
The eleven Tailwind steps 50 to 950 from one color. Export for tailwind.config.js, @theme, OKLCH and HEX.
Open in editor
Palette from Image
Drop in a photo and get its main colors with their share in percent. The image stays in your browser.
Open in editor

Ready-made color palettes

More than 30 palettes by mood, with HEX, RGB and OKLCH values to copy.