← Back to Editor

#D8ECEA · #F0B4B4 · #321702 · #F89367 · #ECC55C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#D8ECEA

Jade · Lavender · Glacier Blue

HEX
#D8ECEA
RGB
rgb(216, 236, 234)
HSL
hsl(174, 34%, 89%)
HSB
hsb(174, 8%, 93%)
CMYK
cmyk(8%, 0%, 1%, 7%)
Oklch
oklch(92.8% 0.021 189.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#F0B4B4

Peach Pink · LightPink · Cherry Blossom

HEX
#F0B4B4
RGB
rgb(240, 180, 180)
HSL
hsl(0, 67%, 82%)
HSB
hsb(0, 25%, 94%)
CMYK
cmyk(0%, 25%, 25%, 6%)
Oklch
oklch(82.5% 0.070 18.7)

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

#321702

Tangerine · Black · Cinnamon

HEX
#321702
RGB
rgb(50, 23, 2)
HSL
hsl(26, 92%, 10%)
HSB
hsb(26, 96%, 20%)
CMYK
cmyk(0%, 54%, 96%, 80%)
Oklch
oklch(23.9% 0.055 56.3)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#F89367

Apricot · SandyBrown · Warm Sun

HEX
#F89367
RGB
rgb(248, 147, 103)
HSL
hsl(18, 91%, 69%)
HSB
hsb(18, 58%, 97%)
CMYK
cmyk(0%, 41%, 58%, 3%)
Oklch
oklch(76.0% 0.136 43.8)

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

#ECC55C

Ginger · SandyBrown · Sunflower

HEX
#ECC55C
RGB
rgb(236, 197, 92)
HSL
hsl(44, 79%, 64%)
HSB
hsb(44, 61%, 93%)
CMYK
cmyk(0%, 17%, 61%, 7%)
Oklch
oklch(83.7% 0.131 88.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8ECEA
ECD9DB

Analogous

D9ECE1
D8ECEA
D9E5EC

Triadic

D8ECEA
EBD9EC
ECEBD9

Split-Comp.

D8ECEA
ECD9E5
ECE1D9

Tetradic

D8ECEA
E1D9EC
ECD9DB
E5ECD9

Contrast Matrix WCAG 2.1 Contrast

D8ECEA
F0B4B4
321702
F89367
ECC55C
—
1.4
Fail
13.6
AAA
1.8
Fail
1.3
Fail
1.4
Fail
—
9.4
AAA
1.3
Fail
1.1
Fail
13.6
AAA
9.4
AAA
—
7.4
AAA
10.1
AAA
1.8
Fail
1.3
Fail
7.4
AAA
—
1.4
Fail
1.3
Fail
1.1
Fail
10.1
AAA
1.4
Fail
—
White BG
1.2Fail
1.8Fail
16.7AAA
2.2Fail
1.7Fail
Black BG
17.1AAA
11.9AAA
1.3Fail
9.4AAA
12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E1E1EA
D6D5B4
262607
CCCB72
DBDB75

Deuteranopia

E0DEEB
DADEB4
282A08
D2DA74
DDE07B

Tritanopia

D9EBEB
EDB4B4
310B0C
F37A7C
EA898E

Achromatopsia

E6E6E6
C6C6C6
1D1D1D
ACACAC
C5C5C5

Shades & Tints Shades & Tints

#D8ECEA

Dark
Light

#F0B4B4

Dark
Light

#321702

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8ecea;
  --color-2: #f0b4b4;
  --color-3: #321702;
  --color-4: #f89367;
  --color-5: #ecc55c;
}

SCSS

$color-1: #d8ecea;
$color-2: #f0b4b4;
$color-3: #321702;
$color-4: #f89367;
$color-5: #ecc55c;

TAILWIND

colors: {
  'brand-1': '#d8ecea',
  'brand-2': '#f0b4b4',
  'brand-3': '#321702',
  'brand-4': '#f89367',
  'brand-5': '#ecc55c',
}

RGB Array

[216, 236, 234], [240, 180, 180], [50, 23, 2], [248, 147, 103], [236, 197, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8ECEA, #F0B4B4, #321702, #F89367, #ECC55C is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d8ecea; --color-2: #f0b4b4; --color-3: #321702; --color-4: #f89367; --color-5: #ecc55c. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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