Ultramarine

Web-standard ultramarine, a rich deep blue with mysterious purplish undertones

HEX#120A8F

RGBrgb(18, 10, 143)

HSLhsl(244, 87%, 30%)

HSVhsv(244, 93%, 56%)

CMYKcmyk(87%, 93%, 0%, 44%)

HEXA#120A8FFF

RGBArgba(18, 10, 143, 1)

HSLAhsla(244, 87%, 30%, 1)

OKLCHoklch(45.8%, 0.208, 281)

LCHlch(34.7%, 87.1, 300)

🎨 Color Palettes

Analogous2-3 adjacent hues (≤60°)

Triadic3 hues spaced 120° apart

Split ComplementaryMain color + colors adjacent to its complement

Complementary2 hues spaced 180° apart

Tetradic (Rectangle)4 hues forming a rectangle

MonochromaticSingle hue with varying saturation and lightness

♿ WCAG Contrast Colors

Learn More →

Aa14px Body

High Contrast Text

#B3AEF9Ratio 7.1:1AAA

Suitable for body text, headings, and primary content, ensuring readability for all users

Aa14px Body

Standard Text

#B96BF5Ratio 4.4:1AA Large

Suitable for regular body content, meeting WCAG AA standards

Aa14px Body

Large Text / UI Components

#CD0EC0Ratio 3:1AA Large

Suitable for large text (≥18px bold or ≥24px), icons, UI component boundaries

Aa14px Body

Decorative / Dividers

#AC170CRatio 2:1Fail

Suitable for decorative elements, dividers, non-essential text

📊 Color Scales

Online Color Picker → Gradient Generator →

Lightness VariationFixed hue and saturation, proportional lightness scaling 30%→100%

#06032B

#080439

#0A054C

#0C065B

#0E086E

#110981

#130A8F

Saturation VariationFixed hue and lightness, proportional saturation scaling 40%→100%

#353267

#2F2B6E

#2A2574

#241E7B

#1E1782

#191188

#130A8F

Lightness + Saturation Mixed VariationSimultaneous lightness and saturation proportional scaling

#12111D

#15142A

#19163C

#19154C

#191362

#17107A

#130A8F

Hue Fine-TuningFixed saturation and lightness, stepwise hue fine-tuning ±15°

#0A228F

#0A178F

#0A0C8F

#130A8F

#1E0A8F

#290A8F

#340A8F

💡 Use Cases

💎

Jewelry Brands

As the primary color for luxury brand websites, it brilliantly complements diamonds and gemstones, telling stories steeped in time.

🎨

Art Exhibitions

Used on posters or backdrop walls for contemporary art exhibitions, its strong visual tension instantly captures attention.

🖥️

Tech Backgrounds

Dark-mode backgrounds for code editors or tech interfaces, reducing screen glare while showcasing a geeky sense of depth.

👗

Evening Gowns

Velvet or satin gowns that glow with a subtle blue light under illumination, creating an elusive nighttime presence.

📜 Origin & History

The term 'ultramarine' derives from the Latin 'ultramarinus,' meaning 'from beyond the sea,' originally referring to the precious pigment ground from lapis lazuli from Afghanistan. During the Middle Ages and Renaissance, its value rivaled that of gold, and it was reverently reserved for the robes of the Virgin Mary.

Due to its expense, patrons often stipulated in contracts where painters could use ultramarine, as a display of piety and wealth. Masters like Titian and Vermeer excelled at using thin glazes of ultramarine to create visual effects as profound as the cosmos.

In the 19th century, the French government offered a prize for the invention of synthetic ultramarine. Chemist Jean-Baptiste Guimet succeeded in 1828, dramatically reducing costs and bringing this captivating blue into common use, quickly adopted by the Impressionists.

In the digital age, CSS-defined ultramarine retains its deep soul but leans more toward purple. It has become a powerful accent color in web design, often used where authority, mystery, or high-end technological sophistication needs to be conveyed.

🧠 Color Psychology

ProfoundLike gazing into the deep sea or the center of the night sky, sparking infinite reverie and desire to explore the unknown.

AuthoritativeBearing the noble genes of history, it naturally commands awe and lends irrefutable persuasiveness to design.

IntuitiveAssociated with the third eye chakra, it stimulates intuition and spiritual perception, awakening inner wisdom.

MysteriousIts near-light-absorbing darkness envelops unsolved mysteries, arousing curiosity and imagination.

TransformativeSymbolizing spiritual transformation from darkness to light, encouraging the shedding of the old self and profound soul evolution.

IndependentA color that does not conform or follow trends, reflecting independent thinking and a distinctive spirit.

← Back to Explore Colors