← Back to Editor

#F1E1BF · #CBD9C0 · #A8C2B7 · #F9705E · #CEB785

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F1E1BF

Goose Yellow · Wheat · Lemon Cream

HEX
#F1E1BF
RGB
rgb(241, 225, 191)
HSL
hsl(41, 64%, 85%)
HSB
hsb(41, 21%, 95%)
CMYK
cmyk(0%, 7%, 21%, 5%)
Oklch
oklch(91.4% 0.048 85.8)

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

#CBD9C0

Celadon · LightGray · Apple Green

HEX
#CBD9C0
RGB
rgb(203, 217, 192)
HSL
hsl(94, 25%, 80%)
HSB
hsb(94, 12%, 85%)
CMYK
cmyk(6%, 0%, 12%, 15%)
Oklch
oklch(86.8% 0.037 131.2)

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

#A8C2B7

Jade · Silver · Apple Green

HEX
#A8C2B7
RGB
rgb(168, 194, 183)
HSL
hsl(155, 18%, 71%)
HSB
hsb(155, 13%, 76%)
CMYK
cmyk(13%, 0%, 6%, 24%)
Oklch
oklch(79.1% 0.032 168.1)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#F9705E

Peach Pink · Coral · Coral Red

HEX
#F9705E
RGB
rgb(249, 112, 94)
HSL
hsl(7, 93%, 67%)
HSB
hsb(7, 62%, 98%)
CMYK
cmyk(0%, 55%, 62%, 2%)
Oklch
oklch(70.7% 0.171 29.6)

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

#CEB785

Ginger · Tan · Sunflower

HEX
#CEB785
RGB
rgb(206, 183, 133)
HSL
hsl(41, 43%, 66%)
HSB
hsb(41, 35%, 81%)
CMYK
cmyk(0%, 11%, 35%, 19%)
Oklch
oklch(78.7% 0.071 86.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1E1BF
C0D0F1

Analogous

F1C9C0
F1E1BF
E8F1C0

Triadic

F1E1BF
C0F1E2
E2C0F1

Split-Comp.

F1E1BF
C0E8F1
C9C0F1

Tetradic

F1E1BF
C0F1C9
C0D0F1
F1C0E8

Contrast Matrix WCAG 2.1 Contrast

F1E1BF
CBD9C0
A8C2B7
F9705E
CEB785
—
1.1
Fail
1.5
Fail
2.2
Fail
1.5
Fail
1.1
Fail
—
1.3
Fail
1.9
Fail
1.3
Fail
1.5
Fail
1.3
Fail
—
1.5
Fail
1.0
Fail
2.2
Fail
1.9
Fail
1.5
Fail
—
1.4
Fail
1.5
Fail
1.3
Fail
1.0
Fail
1.4
Fail
—
White BG
1.3Fail
1.5Fail
1.9Fail
2.8Fail
2.0Fail
Black BG
16.3AAA
14.2AAA
11.1AAA
7.5AAA
10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAEAC7
D1D1C6
B3B3BA
BEBC62
C4C491

Deuteranopia

EBECC9
D0CFC7
B2B0BA
C6D063
C5C794

Tritanopia

F0CECF
CCCBCC
A9BCBC
F26667
CD9B9D

Achromatopsia

E2E2E2
D2D2D2
B9B9B9
979797
B8B8B8

Shades & Tints Shades & Tints

#F1E1BF

Dark
Light

#CBD9C0

Dark
Light

#A8C2B7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1e1bf;
  --color-2: #cbd9c0;
  --color-3: #a8c2b7;
  --color-4: #f9705e;
  --color-5: #ceb785;
}

SCSS

$color-1: #f1e1bf;
$color-2: #cbd9c0;
$color-3: #a8c2b7;
$color-4: #f9705e;
$color-5: #ceb785;

TAILWIND

colors: {
  'brand-1': '#f1e1bf',
  'brand-2': '#cbd9c0',
  'brand-3': '#a8c2b7',
  'brand-4': '#f9705e',
  'brand-5': '#ceb785',
}

RGB Array

[241, 225, 191], [203, 217, 192], [168, 194, 183], [249, 112, 94], [206, 183, 133]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1E1BF, #CBD9C0, #A8C2B7, #F9705E, #CEB785 is ideal for: health products, baby brands, fresh-style blogs. 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: #f1e1bf; --color-2: #cbd9c0; --color-3: #a8c2b7; --color-4: #f9705e; --color-5: #ceb785. 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 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