Tail Css Colors

Using and customizing the color palette in Tailwind CSS projects. This cheatsheet contains all the default Tailwind CSS colors, including all hex, hsl, rgb and new Tailwind v4 oklch color values. Never forget any Tailwind CSS color again!

Create and customize beautiful Tailwind CSS color palettes. Generate, edit, and export colors for your design with our intuitive color generator tool. Complete Tailwind CSS color palette reference with hex values, instant copy functionality.

Find colors like blue-500, red-600, green. The complete Tailwind color palette in HEX, RGB, HSL, CSS variables, and classes. Ready to copy and paste into your project.

Copy any Tailwind color with our beautiful Tailwind 4 color palette. Click to copy any HEX, OKLCH, or Tailwind 4 color class. Tailwind CSS Colors v4 now uses OKLCH for a more vivid, modern color palette.

Upgraded from RGB, it uses the wider P3 gamut for richer hues and better contrast. Elevate your designs with enhanced accessibility and future. Learn the new CSS-first way to inject brand colors in Tailwind v4, override the OKLCH palette, and ship lighter, theme.

Tailwind CSS color palette generator Instantly generate a ready to use color palette for your Tailwind project. By default, these colors will be made available everywhere in the framework where you use colors, like the text color utilities, border color utilities, background color utilities, and more.