← Back to Editor

#F0C4B9 · #DBC297 · #9CC29B · #5CABA4 · #468189

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

#F0C4B9

Peach Pink · LightPink · Cherry Blossom

HEX
#F0C4B9
RGB
rgb(240, 196, 185)
HSL
hsl(12, 65%, 83%)
HSB
hsb(12, 23%, 94%)
CMYK
cmyk(0%, 18%, 23%, 6%)
Oklch
oklch(85.6% 0.053 34.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#DBC297

Goose Yellow · BurlyWood · Warm Sun

HEX
#DBC297
RGB
rgb(219, 194, 151)
HSL
hsl(38, 49%, 73%)
HSB
hsb(38, 31%, 86%)
CMYK
cmyk(0%, 11%, 31%, 14%)
Oklch
oklch(82.5% 0.064 81.1)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#9CC29B

Celadon · DarkSeaGreen · Apple Green

HEX
#9CC29B
RGB
rgb(156, 194, 155)
HSL
hsl(118, 24%, 68%)
HSB
hsb(118, 20%, 76%)
CMYK
cmyk(20%, 0%, 20%, 24%)
Oklch
oklch(77.6% 0.068 144.2)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#5CABA4

Mineral Blue · CadetBlue · Lake Green

HEX
#5CABA4
RGB
rgb(92, 171, 164)
HSL
hsl(175, 32%, 52%)
HSB
hsb(175, 46%, 67%)
CMYK
cmyk(46%, 0%, 4%, 33%)
Oklch
oklch(68.9% 0.079 188.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#468189

Slate Blue · SlateGray · Mint Ice

HEX
#468189
RGB
rgb(70, 129, 137)
HSL
hsl(187, 32%, 41%)
HSB
hsb(187, 49%, 54%)
CMYK
cmyk(49%, 6%, 0%, 46%)
Oklch
oklch(56.6% 0.063 206.9)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0C4B9
B7E5F0

Analogous

F0B7C8
F0C4B9
F0DFB7

Triadic

F0C4B9
B7F0C3
C3B7F0

Split-Comp.

F0C4B9
B7F0DF
B7C8F0

Tetradic

F0C4B9
C8F0B7
B7E5F0
DFB7F0

Contrast Matrix WCAG 2.1 Contrast

F0C4B9
DBC297
9CC29B
5CABA4
468189
—
1.1
Fail
1.3
Fail
1.7
Fail
2.8
Fail
1.1
Fail
—
1.1
Fail
1.6
Fail
2.6
Fail
1.3
Fail
1.1
Fail
—
1.4
Fail
2.2
Fail
1.7
Fail
1.6
Fail
1.4
Fail
—
1.6
Fail
2.8
Fail
2.6
Fail
2.2
Fail
1.6
Fail
—
White BG
1.6Fail
1.7Fail
2.0Fail
2.7Fail
4.4AA Large
Black BG
13.3AAA
12.2AAA
10.6AAA
7.8AAA
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDBC
D0D0A1
ACADA4
7E7FA6
606087

Deuteranopia

E0E3BC
D2D3A4
AAA7A7
7A74A6
5C5887

Tritanopia

EEBEBE
DAAAAB
9EACAE
60A7A7
498685

Achromatopsia

D0D0D0
C5C5C5
B2B2B2
939393
707070

Shades & Tints Shades & Tints

#F0C4B9

Dark
Light

#DBC297

Dark
Light

#9CC29B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0c4b9;
  --color-2: #dbc297;
  --color-3: #9cc29b;
  --color-4: #5caba4;
  --color-5: #468189;
}

SCSS

$color-1: #f0c4b9;
$color-2: #dbc297;
$color-3: #9cc29b;
$color-4: #5caba4;
$color-5: #468189;

TAILWIND

colors: {
  'brand-1': '#f0c4b9',
  'brand-2': '#dbc297',
  'brand-3': '#9cc29b',
  'brand-4': '#5caba4',
  'brand-5': '#468189',
}

RGB Array

[240, 196, 185], [219, 194, 151], [156, 194, 155], [92, 171, 164], [70, 129, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0C4B9, #DBC297, #9CC29B, #5CABA4, #468189 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: #f0c4b9; --color-2: #dbc297; --color-3: #9cc29b; --color-4: #5caba4; --color-5: #468189. 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