← Back to Editor

#5069A2 · #8694A7 · #B4AAA4 · #D4C7A7 · #E4D8AE

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#5069A2

Indigo · SteelBlue · Navy Blue

HEX
#5069A2
RGB
rgb(80, 105, 162)
HSL
hsl(222, 34%, 47%)
HSB
hsb(222, 51%, 64%)
CMYK
cmyk(51%, 35%, 0%, 36%)
Oklch
oklch(52.7% 0.095 265.3)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#8694A7

Azure · LightSlateGray · Navy Blue

HEX
#8694A7
RGB
rgb(134, 148, 167)
HSL
hsl(215, 16%, 59%)
HSB
hsb(215, 20%, 65%)
CMYK
cmyk(20%, 11%, 0%, 35%)
Oklch
oklch(66.2% 0.033 256.1)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#B4AAA4

Apricot · DarkGray · Warm Sun

HEX
#B4AAA4
RGB
rgb(180, 170, 164)
HSL
hsl(22, 10%, 67%)
HSB
hsb(22, 9%, 71%)
CMYK
cmyk(0%, 6%, 9%, 29%)
Oklch
oklch(74.5% 0.014 53.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#D4C7A7

Goose Yellow · Silver · Sunflower

HEX
#D4C7A7
RGB
rgb(212, 199, 167)
HSL
hsl(43, 34%, 74%)
HSB
hsb(43, 21%, 83%)
CMYK
cmyk(0%, 6%, 21%, 17%)
Oklch
oklch(83.2% 0.045 88.5)

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

#E4D8AE

Goose Yellow · Wheat · Lemon Cream

HEX
#E4D8AE
RGB
rgb(228, 216, 174)
HSL
hsl(47, 50%, 79%)
HSB
hsb(47, 24%, 89%)
CMYK
cmyk(0%, 5%, 24%, 11%)
Oklch
oklch(88.1% 0.057 94.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5069A2
A1884F

Analogous

4F90A1
5069A2
5F4FA1

Triadic

5069A2
A14F68
68A14F

Split-Comp.

5069A2
A15F4F
90A14F

Tetradic

5069A2
A14F90
A1884F
4FA15F

Contrast Matrix WCAG 2.1 Contrast

5069A2
8694A7
B4AAA4
D4C7A7
E4D8AE
—
1.8
Fail
2.4
Fail
3.2
AA Large
3.8
AA Large
1.8
Fail
—
1.4
Fail
1.8
Fail
2.2
Fail
2.4
Fail
1.4
Fail
—
1.4
Fail
1.6
Fail
3.2
AA Large
1.8
Fail
1.4
Fail
—
1.2
Fail
3.8
AA Large
2.2
Fail
1.6
Fail
1.2
Fail
—
White BG
5.4AA
3.1AA Large
2.3Fail
1.7Fail
1.4Fail
Black BG
3.9AA Large
6.8AA
9.2AAA
12.5AAA
14.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5B94
8C8CA2
B0B0A5
CECEAF
DFDFB8

Deuteranopia

595891
8B8AA1
B0B1A6
CFD0B1
E0E0BB

Tritanopia

518987
879F9E
B4A7A7
D3B5B6
E3C0C2

Achromatopsia

686868
929292
ACACAC
C7C7C7
D7D7D7

Shades & Tints Shades & Tints

#5069A2

Dark
Light

#8694A7

Dark
Light

#B4AAA4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5069a2;
  --color-2: #8694a7;
  --color-3: #b4aaa4;
  --color-4: #d4c7a7;
  --color-5: #e4d8ae;
}

SCSS

$color-1: #5069a2;
$color-2: #8694a7;
$color-3: #b4aaa4;
$color-4: #d4c7a7;
$color-5: #e4d8ae;

TAILWIND

colors: {
  'brand-1': '#5069a2',
  'brand-2': '#8694a7',
  'brand-3': '#b4aaa4',
  'brand-4': '#d4c7a7',
  'brand-5': '#e4d8ae',
}

RGB Array

[80, 105, 162], [134, 148, 167], [180, 170, 164], [212, 199, 167], [228, 216, 174]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5069A2, #8694A7, #B4AAA4, #D4C7A7, #E4D8AE is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #5069a2; --color-2: #8694a7; --color-3: #b4aaa4; --color-4: #d4c7a7; --color-5: #e4d8ae. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 general-style 5-color scheme is especially suited for beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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