Using Indigo in design
HEX
#4B0082
RGB
75, 0, 130
HSL
275°, 100%, 25%
HSV
275°, 100%, 51%
Indigo (#4B0082) is a deep blue-violet that sits between blue and purple on the spectrum. It conveys depth, wisdom, and creative authority — making it a sophisticated alternative to navy for brands that want distinction.
Best for
Editorial design, magazine spreads, and premium print collateral.
Accessibility
White text on indigo passes AAA at 12.95:1, so it is safe for dark backgrounds and section headers.
How does indigo compare to nearby colors?
What is the difference between indigo and grape?
Indigo (#4B0082) lands deeper on the value scale than Grape (#6F2DA8), so the first impression is about darkness before hue. Indigo reads faster on screen, so it changes the palette from steady to attention-seeking more quickly than Grape does. Choose indigo when the design needs a darker base color that can hold text, framing, or heavier contrast work; keep grape for lighter-facing surfaces.
What color is indigo?
Indigo has a rich history as one of the oldest textile dyes, extracted from the Indigofera plant. It is the dye responsible for the characteristic blue of denim jeans, and was once so valuable it was known as "blue gold" in global trade.
What is the hex code for indigo?
| Format | Value |
|---|---|
| HEX | #4B0082 |
| RGB | rgb(75, 0, 130) |
| HSL | hsl(275°, 100%, 25%) |
| HSV / HSB | hsv(275°, 100%, 51%) |
| CMYK (approx.) | cmyk(42%, 100%, 0%, 49%) |
Convert Indigo to other color formats
Open the color converter with Indigo (#4B0082) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.
Convert Indigo in the color converter →What does indigo mean in design?
Indigo bridges rationality (blue) and creativity (purple), making it the color of intuition and deep thought. It conveys wisdom, integrity, and quiet confidence. In branding, indigo works for companies that want to feel both trustworthy and innovative — fintech, edtech, and creative agencies.
How do I use indigo in code?
| CSS (hex) | color: #4B0082; |
| CSS (rgb) | color: rgb(75, 0, 130); |
| CSS (hsl) | color: hsl(275, 100%, 25%); |
| RGB % | rgb(29%, 0%, 51%) |
| Tailwind | text-[#4B0082] |
| SwiftUI | Color(red: 0.294, green: 0.000, blue: 0.510) |
| UIKit | UIColor(red: 0.294, green: 0.000, blue: 0.510, alpha: 1.0) |
| Android | Color.rgb(75, 0, 130) |
| Compose | Color(0xFF4B0082) |
| Web Safe | #330099 |
Is indigo accessible?
| Combination | Ratio | AA | AA lg | AAA | AAA lg | UI |
|---|---|---|---|---|---|---|
| AaWhite text on this color | 12.95:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaBlack text on this color | 1.62:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaThis color as text on white | 12.95:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaThis color as text on black | 1.62:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.
How does indigo look with color blindness?
Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.
What colors go with indigo
Gold warms indigo enough to keep the palette from feeling chilly or overly technical, while still reading intentional rather than decorative-for-its-own-sake.
White sharpens indigo without cooling it off, which is useful when you need a clean interface or slide layout around the color.
Coral changes how indigo comes across: more food, promotion, and social-first graphics in mood, and less likely to feel isolated or unfinished.
What colors clash with indigo
Neon Green beside indigo tends to vibrate on bright displays, so the pair reads more like a HUD effect than a considered brand palette.
Magenta remaps indigo too aggressively, dragging it away from luxury, culture, and dramatic editorial systems and into a brighter, more performative palette.
Orange lands abruptly next to indigo and can make the palette feel more promo-coded or team-coded than intended.
Pastel Pink can undercut indigo's authority by turning the combination more decorative than decisive.
How should I use indigo in design?
- •Indigo works as a more distinctive alternative to navy — it carries the same authority but with a creative edge.
- •Pair indigo with gold or amber for a rich, premium palette, or with white and light gray for a modern tech aesthetic.
- •Use indigo for dark-mode UI themes — it feels more vibrant than pure navy while maintaining readability.
What are good indigo palettes?
Midnight authority
Editorial design, magazine spreads, and premium print collateral.
Design with indigo in Moda
Create a presentation or document using indigo as your accent color. Moda's AI applies your color palette automatically.
Create a design with indigo →What are the shades and tints of indigo?
Shades (darker)
Tints (lighter)
Tones (desaturated)
Hue variations
What are the color harmonies for indigo?
Harmonies are calculated from the base swatch. When a harmony matches a named color page, it links there; otherwise it appears here as a computed reference swatch.
Similar colors
Purple
Purple occupies a similar depth to indigo, though it pushes the family toward a more warm-leaning reading and a different material feel.
Grape
Grape stays in the same color family as indigo, but the change in value moves it into different layout jobs, especially once backgrounds, charts, or section dividers enter the system.
Deep Purple
Deep Purple is close enough to indigo to keep the palette cohesive, yet the lighter-darker shift still decides whether the family behaves more like atmosphere or more like structure.
Navy Blue
Navy Blue keeps some overlap with indigo, but the shift in finish and association is enough to make one feel better suited to this particular layout than the other.
Midnight Blue
Midnight Blue turns the same general family toward a different energy level, which matters if the palette should feel punchier, dustier, more cosmetic, or more editorial.
Frequently asked questions
What is the hex code for indigo?
The hex code for indigo is #4B0082. In RGB, that's 75 red, 0 green, and 130 blue. The approximate CMYK equivalent is 42% cyan, 100% magenta, 0% yellow, and 49% key (black).
Is indigo a warm or cool color?
Indigo leans cool but is not icy, so it can stay composed with blues and greens or feel more balanced when warmed up with cream, tan, or muted gold.
Should indigo lead the palette or stay in supporting roles?
Indigo has enough chroma to take the lead, but it usually performs best when the surrounding system stays quieter. Treat it as the voice of emphasis, not the answer to every layout need.
Where does indigo work best in a layout?
Indigo has enough depth to anchor a layout while still reading as a color, which makes it useful for dark section blocks, headlines, and heavier accents.
Is indigo accessible?
Indigo is strong enough for white text at 12.95:1 contrast, so it can handle dark panels, tags, and section headers without much trouble. As text on white, though, it is usually better reserved for larger headings or short accents than for long paragraphs.
More purple colors
Keep exploring color resources
All color pages
Browse the full library of color references, pairings, and palettes.
Purple colors
Compare indigo with other purple tones.
Blue colors
Explore nearby color families to build stronger palettes and contrasts.
Neutral colors
Explore nearby color families to build stronger palettes and contrasts.
Pink colors
Explore nearby color families to build stronger palettes and contrasts.
Last updated April 6, 2026
Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.