Ubify Intelligence Team

EDITORIAL TEAM

~2 min read
~268 words
VERIFIED JUNE 2026

About This Tool

The Tailwind CSS Color Finder allows you to instantly find the Hex codes for the entire official Tailwind color palette — a vital tool for developers building themes with the popular CSS framework. it includes all shades from 50 to 950. This tool is free, private, and executes all lookups locally.

How to Use

  1. 1

    Browse the full Tailwind color palette organized by color family.

  2. 2

    Click any color swatch to see its hex code

  3. 3

    RGB values

  4. 4

    and Tailwind class name.

  5. 5

    Copy the class name (e.g.

  6. 6

    blue-500) or hex code for use in your project.

  7. 7

    Browse the organized grid of official Tailwind CSS colors.

  8. 8

    Click on any color block to copy its Hex code or Tailwind class name.

  9. 9

    Use the search bar to find specific colors (e.g., "blue" or "slate") instantly.

  10. 10

    Does it support the custom v3 colors?

  11. 11

    Yes, our tool is updated to include all the latest colors added in Tailwind CSS v3.0+, including Slate, Gray, Zinc, Neutral, and Stone.

Frequently Asked Questions

Does this include Tailwind v3 and v4 colors?

Yes. The palette covers the full Tailwind v3 default color set. Extended colors added in utility configs are also listed if standard.

Can I search by hex code to find the closest Tailwind color?

Yes. Enter a hex code in the search box and the closest matching Tailwind color and shade is highlighted.

Is this Tailwind color finder free?

Yes. Completely free with no account required.

Does it support the custom v3 colors?

Yes, our tool is updated to include all the latest colors added in Tailwind CSS v3.0+, including Slate, Gray, Zinc, Neutral, and Stone.