← Back to Editor

#ABD6B8 · #DBCDA8 · #F3C69F · #F1C2CC · #FFD4BD

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#ABD6B8

Celadon · Silver · Apple Green

HEX
#ABD6B8
RGB
rgb(171, 214, 184)
HSL
hsl(138, 34%, 75%)
HSB
hsb(138, 20%, 84%)
CMYK
cmyk(20%, 0%, 14%, 16%)
Oklch
oklch(83.7% 0.061 154.5)

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

#DBCDA8

Goose Yellow · Wheat · Lemon Cream

HEX
#DBCDA8
RGB
rgb(219, 205, 168)
HSL
hsl(44, 41%, 76%)
HSB
hsb(44, 23%, 86%)
CMYK
cmyk(0%, 6%, 23%, 14%)
Oklch
oklch(85.0% 0.052 89.8)

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

#F3C69F

Apricot · Wheat · Peach Orange

HEX
#F3C69F
RGB
rgb(243, 198, 159)
HSL
hsl(28, 78%, 79%)
HSB
hsb(28, 35%, 95%)
CMYK
cmyk(0%, 19%, 35%, 5%)
Oklch
oklch(85.6% 0.073 62.5)

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

#F1C2CC

Peach Pink · Pink · Cherry Blossom

HEX
#F1C2CC
RGB
rgb(241, 194, 204)
HSL
hsl(347, 63%, 85%)
HSB
hsb(347, 20%, 95%)
CMYK
cmyk(0%, 20%, 15%, 5%)
Oklch
oklch(85.8% 0.055 4.0)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#FFD4BD

Apricot · Wheat · Peach Orange

HEX
#FFD4BD
RGB
rgb(255, 212, 189)
HSL
hsl(21, 100%, 87%)
HSB
hsb(21, 26%, 100%)
CMYK
cmyk(0%, 17%, 26%, 0%)
Oklch
oklch(90.1% 0.058 49.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABD6B8
D5AAC8

Analogous

B2D5AA
ABD6B8
AAD5CC

Triadic

ABD6B8
B7AAD5
D5B7AA

Split-Comp.

ABD6B8
CCAAD5
D5AAB2

Tetradic

ABD6B8
AAB2D5
D5AAC8
D5CCAA

Contrast Matrix WCAG 2.1 Contrast

ABD6B8
DBCDA8
F3C69F
F1C2CC
FFD4BD
—
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
—
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
1.0
Fail
—
1.0
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.0
Fail
—
1.2
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.2
Fail
—
White BG
1.6Fail
1.6Fail
1.6Fail
1.6Fail
1.4Fail
Black BG
13.0AAA
13.3AAA
13.4AAA
13.3AAA
15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBEBF
D5D5B1
E0DFA8
DDDCCA
ECECC3

Deuteranopia

BBB8C1
D6D7B3
E2E6AB
DFE3C9
EFF2C4

Tritanopia

ADC5C6
DAB8BA
F1B0B2
EFC8C7
FDC7C8

Achromatopsia

C6C6C6
CDCDCD
CFCFCF
D1D1D1
DEDEDE

Shades & Tints Shades & Tints

#ABD6B8

Dark
Light

#DBCDA8

Dark
Light

#F3C69F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #abd6b8;
  --color-2: #dbcda8;
  --color-3: #f3c69f;
  --color-4: #f1c2cc;
  --color-5: #ffd4bd;
}

SCSS

$color-1: #abd6b8;
$color-2: #dbcda8;
$color-3: #f3c69f;
$color-4: #f1c2cc;
$color-5: #ffd4bd;

TAILWIND

colors: {
  'brand-1': '#abd6b8',
  'brand-2': '#dbcda8',
  'brand-3': '#f3c69f',
  'brand-4': '#f1c2cc',
  'brand-5': '#ffd4bd',
}

RGB Array

[171, 214, 184], [219, 205, 168], [243, 198, 159], [241, 194, 204], [255, 212, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ABD6B8, #DBCDA8, #F3C69F, #F1C2CC, #FFD4BD is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. 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: #abd6b8; --color-2: #dbcda8; --color-3: #f3c69f; --color-4: #f1c2cc; --color-5: #ffd4bd. 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 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