#8A2BE2 Vivid Indigo

Q: What color is #8A2BE2?

Vivid Indigo is #8A2BE2, or #8A2BE2 in uppercase notation. In RGB it is rgb(138,43,226), in HSL about hsl(271 76% 53%), and in OKLCH oklch(0.534 0.250 301.4).

Q: What does Vivid Indigo symbolize?

It usually stands for energy, warmth and confidence, with a ceremonial edge. Local culture can shift that reading, so check the context.

Q: Where is Vivid Indigo used?

You will see it in Campaign landing pages, Editorial cover systems, Product packaging labels, Dashboard status accents, Retail wayfinding signs. It also appears across beauty, culture, technology, luxury goods.

Q: Which colors go well with Vivid Indigo?

Muted neutrals, deeper steps of the same hue and one metallic accent work well. editorial layouts that need one warm focal point; packaging that should feel appetizing without shouting; interfaces where an accent has to stay legible

Q: How does Vivid Indigo affect mood?

It raises perceived energy and draws the eye quickly. Large fields feel intense, so accent use is safer.

Q: Which industries use Vivid Indigo?

It is common in beauty, culture, technology, luxury goods, particularly where brands want to feel luxurious, creative, mysterious, spiritual, refined.

Q: What is the history of Vivid Indigo?

The pigment story is concrete: Purple has always required rare dye or careful mixing, and that expense still colors its reputation. It balances ceremony, imagination and a faint air of mystery.

Q: How should I use Vivid Indigo in design?

Give it one focal element, keep body copy neutral and confirm contrast at 5.96 against white and 3.17 against black.

Q: Is Vivid Indigo accessible?

Contrast is 5.96 against white (AA) and 3.17 against black (FAIL). Use it for large text when the level reaches AA.

Color conversion

CMYK profile: Coated FOGRA39 · Formats follow CSS Color 4 naming and WCAG 2.2 contrast rules.

About this color

Vivid IndigoPurpledigital color

Luxury with a secret

Vivid Indigo is #8A2BE2, a Purple tone with a clear cultural lineage. Read on its own it belongs to the Purple family; read through its digital color roots, it carries a second layer of meaning.

Design tip

Test Vivid Indigo (#8A2BE2) on a neutral surface first; a Purple accent then looks intentional rather than decorative.

Best use

Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.

luxuriouscreativemysteriousspiritualrefined

Psychology

How it is perceived

luxuriouscreativemysteriousspiritualrefined

Psychological effect

Vivid Indigo raises the perceived energy of a Purple composition and pulls the eye toward action.

Emotional impact

It feels immediate and warm, so it can lift a restrained layout without making it loud.

Symbolism

What it stands for

creativityprestige and imagination

Cultural significance

In digital color settings the shade carries local references, so verify its symbolism before a campaign.

Positive associations

Positive associations lean toward creativity, prestige and imagination, which is why it appears in invitations and seasonal work.

Use with care

Too much surface area can read as artificiality or elitism when overdone, so keep it to accents and small fields.

Where it appears

Common design applications

Campaign landing pages: Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.
Editorial cover systems: Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.
Product packaging labels: Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.
Dashboard status accents: Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.
Retail wayfinding signs: Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.

Design guidance

How to make it work

Keep saturated fills below about twenty percent of the layout.
Use it for the primary call to action and nothing else.
Check the pairing at small sizes on a neutral background.

Avoid

Do not place it beside clashing neon greens or electric blues.
Never use it for long body text on white.
Avoid gradients that shift its hue into another family.

Brand fit

beauty, culture, technology, luxury goods

Brands built on The Magician, The Creator use it to signal character before they say a word.

Trend signal

Luxury with a secret

Purple has always required rare dye or careful mixing, and that expense still colors its reputation. It balances ceremony, imagination and a faint air of mystery.

Pairing

Colors that complete it

#5A7D00editorial layouts that need one warm focal point #5800A4interfaces where an accent has to stay legible #C92700packaging that should feel appetizing without shouting

History

Pigments and provenance

Before synthetic dyes, Vivid Indigo was matched with mineral and plant pigments, and the Purple family depended on sources such as ochre, madder and indigo. Screens now reproduce it more consistently than any single pigment ever could.

Variations

Shades darken and tints lighten while the hue angle stays fixed.

Pro tip: Shades darken and tints lighten while the hue angle stays fixed.

Shades

Darker steps built from the same hue.

0% #8A2BE2 10% #7C27CB 20% #6E22B5 30% #611E9E 40% #531A88 50% #451671 60% #37115A 70% #290D44 80% #1C092D 90% #0E0417 100% #000000

Tints

Lighter steps for surfaces and backgrounds.

0% #8A2BE2 10% #9640E5 20% #A155E8 30% #AD6BEB 40% #B980EE 50% #C595F1 60% #D0AAF3 70% #DCBFF6 80% #E8D5F9 90% #F3EAFC 100% #FFFFFF

Use cases

Shades → hover, shadows, depth
Tints → highlights, surfaces
Balance → consistent color systems

Design tip

Keep one dominant tone, one supporter and one accent.

Color combinations

Rotate the hue wheel while holding lightness steady.

How to use it

Three moves keep the color readable and deliberate.

Why it works

The perceptual reasoning behind the palette.

Complementary

Opposite the hue wheel; it sharpens the focal color by contrast.

#8A2BE2 #5A7D00

Best use: Calls to action and single-feature highlights

Split-complementary

Two neighbors of the opposite hue; softer than a direct complement.

#8A2BE2 #A25C00 #009000

Best use: Balanced marketing layouts with two accents

Triadic

Three hues spaced evenly; lively but needs one dominant voice.

#8A2BE2 #C92700 #009476

Best use: Event identities and playful editorial spreads

Analogous

Neighbors on the wheel; quiet, cohesive and easy to scan.

#424EFA #8A2BE2 #B600AC

Best use: Backgrounds, charts and calm product pages

Monochromatic

One hue across lightness steps; disciplined and premium.

#631FA3 #8A2BE2 #AB66EA

Best use: Design systems, packaging and typographic hierarchy

Tetradic

Two complementary pairs; rich, but requires strict proportion.

#8A2BE2 #D10063 #5A7D00 #009476

Best use: Complex dashboards and multi-service brands

Export palette

CSS

:root {
  --color-1: #531A88;
  --color-2: #6E22B5;
  --color-3: #8A2BE2;
  --color-4: #A155E8;
  --color-5: #B980EE;
}

Tailwind

colors: {
  color1: '#531A88',
  color2: '#6E22B5',
  color3: '#8A2BE2',
  color4: '#A155E8',
  color5: '#B980EE',
}

JSON

["#531A88","#6E22B5","#8A2BE2","#A155E8","#B980EE"]

Principles

Balance

Keep one dominant tone, one supporter and one accent.

Contrast

Test body text against both white and black before shipping.

Harmony

Rotate the hue wheel while holding lightness steady.

Color contrast checker

Test body text against both white and black before shipping.

Text color

Background

5.96 :1

Quote

Give Vivid Indigo the single element that must be noticed first, and let the rest of the Purple palette support it.

WCAG contrast

Preview

Aa / Bb

#8A2BE2 · Vivid Indigo

WCAG contrast standards

WCAG 2.2 sets minimum contrast for text and interface parts. #8A2BE2 measures 5.96:1 against white (AA) and 3.17:1 against black (FAIL). Use the table below to choose the right threshold for the text size.

Level	Normal text	Large text (18pt+ / 14pt bold)	Icons & UI parts
AAA	7 : 1	4.5 : 1	—
AA	4.5 : 1	3 : 1	3 : 1
Fails	< 4.5 : 1	< 3 : 1	< 3 : 1

Large text means 18pt regular or 14pt bold. UI parts need 3:1 against adjacent colors. AA is the common compliance baseline; AAA is enhanced.

Technical formats

Notation across color spaces

HEX

#8A2BE2

CSS Color 4

RGB

138,43,226

sRGB / D65

HSL

271,76,53

HSL

OKLCH

oklch(0.534 0.250 301.4)

perceptual

LAB

42,70,-75

CIE Lab

LCH

42,102,313

CIE LCH

XYZ

25,13,73

CIE XYZ

LUV

42,18,-113

CIE LUV

HWB

271,17,11

CSS HWB

CMYK

39,81,0,11

Practical formats

Ready-to-use values

CSS

color: #8A2BE2;

custom properties

Tailwind

bg-[#8A2BE2] text-[#FFF]

arbitrary value

Android

#FF8A2BE2

ARGB

Flutter

Color(0xFF8A2BE2)

dart:ui

Photoshop

R 138 G 43 B 226 · C 39 M 81 Y 0 K 11

RGB / CMYK

CMYK 39,81,0,11

FOGRA39

Color analysis

Measured color properties

Lightness

0.126

relative luminance · neutral

Contrast

5.96 : 1

vs white · AA · neutral

Contrast

3.17 : 1

vs black · FAIL · neutral

Hue

271°

saturation 76% · neutral

LCH

42,102,313

lightness 53% · neutral

Delta E

83.1

品红 #EC3A78 · neutral

Similar colors

Nearest colors from the full Irodori library, ranked by ΔE.

Vivid Violet #9400D3ΔE 8.3 Vivid Indigo #A855F7ΔE 15.0 Vivid Violet #9932CCΔE 15.4 Vivid Indigo #8B5CF6ΔE 19.6 Deep Blue #0000CDΔE 24.2 Vivid Violet #D946EFΔE 24.6

Blindness simulator

How it reads with color vision deficiency

How it reads with color vision deficiency · ΔE 83.1