← Back to Editor

#F0D6C9 · #FBB9A9 · #E2726E · #684F4A · #3E2F2C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F0D6C9

Apricot · Bisque · Peach Orange

HEX
#F0D6C9
RGB
rgb(240, 214, 201)
HSL
hsl(20, 57%, 86%)
HSB
hsb(20, 16%, 94%)
CMYK
cmyk(0%, 11%, 16%, 6%)
Oklch
oklch(89.4% 0.034 48.3)

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

#FBB9A9

Peach Pink · LightPink · Cherry Blossom

HEX
#FBB9A9
RGB
rgb(251, 185, 169)
HSL
hsl(12, 91%, 82%)
HSB
hsb(12, 33%, 98%)
CMYK
cmyk(0%, 26%, 33%, 2%)
Oklch
oklch(84.3% 0.080 34.1)

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

#E2726E

Peach Pink · LightCoral · Coral Red

HEX
#E2726E
RGB
rgb(226, 114, 110)
HSL
hsl(2, 67%, 66%)
HSB
hsb(2, 51%, 89%)
CMYK
cmyk(0%, 50%, 51%, 11%)
Oklch
oklch(68.1% 0.140 23.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#684F4A

Crimson · DimGray · Wine Red

HEX
#684F4A
RGB
rgb(104, 79, 74)
HSL
hsl(10, 17%, 35%)
HSB
hsb(10, 29%, 41%)
CMYK
cmyk(0%, 24%, 29%, 59%)
Oklch
oklch(45.2% 0.035 31.4)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#3E2F2C

Crimson · DarkSlateGray · Wine Red

HEX
#3E2F2C
RGB
rgb(62, 47, 44)
HSL
hsl(10, 17%, 21%)
HSB
hsb(10, 29%, 24%)
CMYK
cmyk(0%, 24%, 29%, 76%)
Oklch
oklch(32.1% 0.023 31.4)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0D6C9
C7E2F0

Analogous

F0C7CE
F0D6C9
F0E9C7

Triadic

F0D6C9
C7F0D5
D5C7F0

Split-Comp.

F0D6C9
C7F0E9
C7CEF0

Tetradic

F0D6C9
CEF0C7
C7E2F0
E9C7F0

Contrast Matrix WCAG 2.1 Contrast

F0D6C9
FBB9A9
E2726E
684F4A
3E2F2C
—
1.2
Fail
2.2
Fail
5.4
AA
9.2
AAA
1.2
Fail
—
1.8
Fail
4.5
AA Large
7.7
AAA
2.2
Fail
1.8
Fail
—
2.4
Fail
4.2
AA Large
5.4
AA
4.5
AA Large
2.4
Fail
—
1.7
Fail
9.2
AAA
7.7
AAA
4.2
AA Large
1.7
Fail
—
White BG
1.4Fail
1.7Fail
3.1AA Large
7.5AAA
12.7AAA
Black BG
15.2AAA
12.6AAA
6.9AA
2.8Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E5CC
DEDEAD
B2B06F
5D5D4B
38372D

Deuteranopia

E6E8CD
E2E7AE
B8C06F
5F614C
383A2D

Tritanopia

EFCFCF
F8B0B1
DC7070
674C4C
3D2D2D

Achromatopsia

DCDCDC
CBCBCB
939393
565656
333333

Shades & Tints Shades & Tints

#F0D6C9

Dark
Light

#FBB9A9

Dark
Light

#E2726E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0d6c9;
  --color-2: #fbb9a9;
  --color-3: #e2726e;
  --color-4: #684f4a;
  --color-5: #3e2f2c;
}

SCSS

$color-1: #f0d6c9;
$color-2: #fbb9a9;
$color-3: #e2726e;
$color-4: #684f4a;
$color-5: #3e2f2c;

TAILWIND

colors: {
  'brand-1': '#f0d6c9',
  'brand-2': '#fbb9a9',
  'brand-3': '#e2726e',
  'brand-4': '#684f4a',
  'brand-5': '#3e2f2c',
}

RGB Array

[240, 214, 201], [251, 185, 169], [226, 114, 110], [104, 79, 74], [62, 47, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0D6C9, #FBB9A9, #E2726E, #684F4A, #3E2F2C 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: #f0d6c9; --color-2: #fbb9a9; --color-3: #e2726e; --color-4: #684f4a; --color-5: #3e2f2c. 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