HEX
#4F46E5Primary tokenDesign System Color Reference
Tailwind Indigo 600 Color Code
Tailwind Indigo 600·#4F46E5
Blue FamilyCoolMid toneHigh saturationoklch(51.1% 0.230 277)
RGB
rgb(79, 70, 229)Screen valuesHSL
hsl(243 75% 59%)Hue and lightnessCMYK
66, 69, 0, 10Print handoffLAB
41, 51, -79Perceptual referenceOKLCH
oklch(51.1% 0.230 277)Modern perceptualTailwind Indigo 600 is the published Tailwind CSS token for `#4F46E5`. If you searched `#4F46E5`, `4F46E5 color`, or `indigo-600`, this page is the exact match. It is darker than Indigo 500 and is commonly used for CTAs, active navigation, app hierarchy, and product UI that needs a cooler blue-violet anchor.
Best text colorWhite text
Body text contrast6.29:1
Best UseExact `#4F46E5` token lookup, stronger CTAs, and deeper Tailwind product hierarchy
Tonal Scale
100#DFDEFA
300#AEAAF3
500#6F67EA
600#4F46E5
800#3932A5
Contrast Checks
White text on this color
Buttons, badges, and filled actions.
6.29:1Safe for body text
Dark text on this color
Large headings and selective UI.
2.73:1Needs more separation
This color on light surface
Links, borders, and icons on light UI.
5.97:1Safe for body text
Best text colorWhite textContrast 6.29:1
Professional Reference
OKLCHoklch(51.1% 0.230 277)
Relative Luminance0.1170
Source TypeDesign System Color
Classification
Blue FamilyCoolMid toneHigh saturation
Source Context
Source Type
Design System Color
System
Tailwind
Step
600
System Role
- Often used for stronger actions, active states, and hover emphasis.
Aliases
#4F46E54F46E5Indigo 600Tailwind Indigo 600
Closest Matches
Color Notes
- Tailwind Indigo 600 is the exact token value for `#4F46E5`.
- It is darker and more forceful than Tailwind Indigo 500, but it is a design-system token, not a CSS named color.
- Searches for `#4F46E5` usually need the exact token mapping and implementation context before any palette exploration.
Accessibility Matrix
White text on this color
White text placed on the current color.
6.29:1AA
Dark text on this color
Dark text or headings on the current color.
2.73:1Needs more separation
This color on light surface
Use this color for links, strokes, or icons on light UI.
5.97:1AA
This color on dark surface
Use this color inside dark shells for strokes, tags, or icons.
2.73:1Needs more separation
Best text colorWhite textContrast 6.29:1 · AA
Where It Works
- Use it when you need the exact Tailwind token behind `#4F46E5` for CTAs, active navigation, or hierarchy anchors.
- Treat it as a design-system token first, especially when the query is value-first or implementation-first.
- Compare it with Indigo 500 if the hue is right but the current step feels too heavy for the interface.
Reference Notes
Last Updated
2026-06-25
Source Library
Tailwind CSS Colors
Methodology
Verified source values + site guidance
Color Notes
Tailwind Indigo 600 is sourced from the published Tailwind CSS Colors library and retained here as a searchable reference swatch for product and interface reference work.
Hue Family
Trust-building blues for enterprise and SaaS.
Source Collections
Design System Palettes
Related Colors
Palette Starting Points
Implementation Snippets
:root {
--color-tailwind-indigo-600: #4F46E5;
--color-tailwind-indigo-600-rgb: 79 70 229;
}class="bg-[#4F46E5] text-white"
class="hover:bg-[#3932A5] ring-1 ring-[#4F46E5]"{
"tailwindIndigo-600": "#4F46E5",
"tailwindIndigo-600Rgb": [79, 70, 229],
"tailwindIndigo-600Hsl": [243, 75, 59]
}