← Back to Editor

#FBF9FC · #E3C0AA · #519971 · #20367F · #0D1856

A 5-color palette 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

#FBF9FC

Lilac · Snow · Lavender

HEX
#FBF9FC
RGB
rgb(251, 249, 252)
HSL
hsl(280, 33%, 98%)
HSB
hsb(280, 1%, 99%)
CMYK
cmyk(0%, 1%, 0%, 1%)
Oklch
oklch(98.4% 0.004 314.8)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#E3C0AA

Apricot · Wheat · Peach Orange

HEX
#E3C0AA
RGB
rgb(227, 192, 170)
HSL
hsl(23, 50%, 78%)
HSB
hsb(23, 25%, 89%)
CMYK
cmyk(0%, 15%, 25%, 11%)
Oklch
oklch(83.2% 0.050 54.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#519971

Celadon · MediumSeaGreen · Olive Green

HEX
#519971
RGB
rgb(81, 153, 113)
HSL
hsl(147, 31%, 46%)
HSB
hsb(147, 47%, 60%)
CMYK
cmyk(47%, 0%, 26%, 40%)
Oklch
oklch(62.5% 0.095 157.7)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#20367F

Indigo · MidnightBlue · Prussian Blue

HEX
#20367F
RGB
rgb(32, 54, 127)
HSL
hsl(226, 60%, 31%)
HSB
hsb(226, 75%, 50%)
CMYK
cmyk(75%, 57%, 0%, 50%)
Oklch
oklch(36.2% 0.127 267.1)

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

#0D1856

Indigo · MidnightBlue · Deep Sea Blue

HEX
#0D1856
RGB
rgb(13, 24, 86)
HSL
hsl(231, 74%, 19%)
HSB
hsb(231, 85%, 34%)
CMYK
cmyk(85%, 72%, 0%, 66%)
Oklch
oklch(25.0% 0.112 268.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBF9FC
F9FCF8

Analogous

F9F8FC
FBF9FC
FCF8FB

Triadic

FBF9FC
FCFAF8
F8FCFA

Split-Comp.

FBF9FC
FBFCF8
F8FCF9

Tetradic

FBF9FC
FCF9F8
F9FCF8
F8FBFC

Contrast Matrix WCAG 2.1 Contrast

FBF9FC
E3C0AA
519971
20367F
0D1856
—
1.6
Fail
3.3
AA Large
10.6
AAA
15.6
AAA
1.6
Fail
—
2.0
Fail
6.5
AA
9.7
AAA
3.3
AA Large
2.0
Fail
—
3.2
AA Large
4.8
AA
10.6
AAA
6.5
AA
3.2
AA Large
—
1.5
Fail
15.6
AAA
9.7
AAA
4.8
AA
1.5
Fail
—
White BG
1.0Fail
1.7Fail
3.4AA Large
11.1AAA
16.4AAA
Black BG
20.1AAA
12.4AAA
6.1AA
1.9Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFAFB
D4D4AF
70717B
2A2A6D
121247

Deuteranopia

FAFAFB
D6D8B1
6C677D
282769
111043

Tritanopia

FBFBFB
E1B4B4
558284
215F5C
0E3B39

Achromatopsia

FAFAFA
C8C8C8
7F7F7F
383838
1C1C1C

Shades & Tints Shades & Tints

#FBF9FC

Dark
Light

#E3C0AA

Dark
Light

#519971

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbf9fc;
  --color-2: #e3c0aa;
  --color-3: #519971;
  --color-4: #20367f;
  --color-5: #0d1856;
}

SCSS

$color-1: #fbf9fc;
$color-2: #e3c0aa;
$color-3: #519971;
$color-4: #20367f;
$color-5: #0d1856;

TAILWIND

colors: {
  'brand-1': '#fbf9fc',
  'brand-2': '#e3c0aa',
  'brand-3': '#519971',
  'brand-4': '#20367f',
  'brand-5': '#0d1856',
}

RGB Array

[251, 249, 252], [227, 192, 170], [81, 153, 113], [32, 54, 127], [13, 24, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FBF9FC, #E3C0AA, #519971, #20367F, #0D1856 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: #fbf9fc; --color-2: #e3c0aa; --color-3: #519971; --color-4: #20367f; --color-5: #0d1856. 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 general-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