← Back to Editor

#122238 · #85B2CC · #E8E5DC · #ADA28B · #473E2A

warm

A 5-color warm palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#122238

Indigo · MidnightBlue · Deep Sea Blue

HEX
#122238
RGB
rgb(18, 34, 56)
HSL
hsl(215, 51%, 15%)
HSB
hsb(215, 68%, 22%)
CMYK
cmyk(68%, 39%, 0%, 78%)
Oklch
oklch(25.0% 0.047 256.7)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#85B2CC

Sky Blue · SkyBlue · Cobalt Blue

HEX
#85B2CC
RGB
rgb(133, 178, 204)
HSL
hsl(202, 41%, 66%)
HSB
hsb(202, 35%, 80%)
CMYK
cmyk(35%, 13%, 0%, 20%)
Oklch
oklch(74.1% 0.061 234.0)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#E8E5DC

Goose Yellow · Beige · Lemon Cream

HEX
#E8E5DC
RGB
rgb(232, 229, 220)
HSL
hsl(45, 21%, 89%)
HSB
hsb(45, 5%, 91%)
CMYK
cmyk(0%, 1%, 5%, 9%)
Oklch
oklch(92.2% 0.012 91.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#ADA28B

Ginger · DarkGray · Sunflower

HEX
#ADA28B
RGB
rgb(173, 162, 139)
HSL
hsl(41, 17%, 61%)
HSB
hsb(41, 20%, 68%)
CMYK
cmyk(0%, 6%, 20%, 32%)
Oklch
oklch(71.5% 0.035 85.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#473E2A

Ochre · DarkSlateGray · Amber Gold

HEX
#473E2A
RGB
rgb(71, 62, 42)
HSL
hsl(41, 26%, 22%)
HSB
hsb(41, 41%, 28%)
CMYK
cmyk(0%, 13%, 41%, 72%)
Oklch
oklch(36.7% 0.034 86.4)

Traditional「Ochre」· Paint「Amber Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

122238
3A2A13

Analogous

13373A
122238
16133A

Triadic

122238
3A1323
233A13

Split-Comp.

122238
3A1613
373A13

Tetradic

122238
3A1337
3A2A13
133A16

Contrast Matrix WCAG 2.1 Contrast

122238
85B2CC
E8E5DC
ADA28B
473E2A
—
7.0
AAA
12.7
AAA
6.3
AA
1.5
Fail
7.0
AAA
—
1.8
Fail
1.1
Fail
4.6
AA
12.7
AAA
1.8
Fail
—
2.0
Fail
8.4
AAA
6.3
AA
1.1
Fail
2.0
Fail
—
4.2
AA Large
1.5
Fail
4.6
AA
8.4
AAA
4.2
AA Large
—
White BG
16.0AAA
2.3Fail
1.3Fail
2.5Fail
10.6AAA
Black BG
1.3Fail
9.2AAA
16.7AAA
8.3AAA
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

191933
9899C6
E7E7DE
A8A891
43432F

Deuteranopia

181731
9693C4
E7E7DF
A9AA92
444430

Tritanopia

132E2E
87C1C0
E8E0E0
AC9596
473334

Achromatopsia

202020
A8A8A8
E5E5E5
A3A3A3
3E3E3E

Shades & Tints Shades & Tints

#122238

Dark
Light

#85B2CC

Dark
Light

#E8E5DC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #122238;
  --color-2: #85b2cc;
  --color-3: #e8e5dc;
  --color-4: #ada28b;
  --color-5: #473e2a;
}

SCSS

$color-1: #122238;
$color-2: #85b2cc;
$color-3: #e8e5dc;
$color-4: #ada28b;
$color-5: #473e2a;

TAILWIND

colors: {
  'brand-1': '#122238',
  'brand-2': '#85b2cc',
  'brand-3': '#e8e5dc',
  'brand-4': '#ada28b',
  'brand-5': '#473e2a',
}

RGB Array

[18, 34, 56], [133, 178, 204], [232, 229, 220], [173, 162, 139], [71, 62, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #122238, #85B2CC, #E8E5DC, #ADA28B, #473E2A is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #122238; --color-2: #85b2cc; --color-3: #e8e5dc; --color-4: #ada28b; --color-5: #473e2a. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This warm-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color