← Back to Editor

#F1AC78 · #EBB775 · #DEC381 · #CFD193 · #BDD5AD

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F1AC78

Apricot · LightSalmon · Warm Sun

HEX
#F1AC78
RGB
rgb(241, 172, 120)
HSL
hsl(26, 81%, 71%)
HSB
hsb(26, 50%, 95%)
CMYK
cmyk(0%, 29%, 50%, 5%)
Oklch
oklch(79.9% 0.106 57.5)

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

#EBB775

Ginger · BurlyWood · Warm Sun

HEX
#EBB775
RGB
rgb(235, 183, 117)
HSL
hsl(34, 75%, 69%)
HSB
hsb(34, 50%, 92%)
CMYK
cmyk(0%, 22%, 50%, 8%)
Oklch
oklch(81.2% 0.103 72.2)

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

#DEC381

Ginger · BurlyWood · Sunflower

HEX
#DEC381
RGB
rgb(222, 195, 129)
HSL
hsl(43, 58%, 69%)
HSB
hsb(43, 42%, 87%)
CMYK
cmyk(0%, 12%, 42%, 13%)
Oklch
oklch(82.5% 0.090 88.1)

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

#CFD193

Fresh Green · Tan · Sunflower

HEX
#CFD193
RGB
rgb(207, 209, 147)
HSL
hsl(62, 40%, 70%)
HSB
hsb(62, 30%, 82%)
CMYK
cmyk(1%, 0%, 30%, 18%)
Oklch
oklch(84.4% 0.081 109.6)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#BDD5AD

Celadon · Silver · Apple Green

HEX
#BDD5AD
RGB
rgb(189, 213, 173)
HSL
hsl(96, 32%, 76%)
HSB
hsb(96, 19%, 84%)
CMYK
cmyk(11%, 0%, 19%, 16%)
Oklch
oklch(84.5% 0.060 132.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1AC78
79BDF1

Analogous

F17981
F1AC78
F1E979

Triadic

F1AC78
79F1AD
AD79F1

Split-Comp.

F1AC78
79F1E9
7981F1

Tetradic

F1AC78
81F179
79BDF1
E979F1

Contrast Matrix WCAG 2.1 Contrast

F1AC78
EBB775
DEC381
CFD193
BDD5AD
—
1.1
Fail
1.1
Fail
1.2
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
—
1.0
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
White BG
1.9Fail
1.8Fail
1.7Fail
1.6Fail
1.6Fail
Black BG
10.9AAA
11.6AAA
12.2AAA
13.2AAA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D385
D4D485
D2D291
D0D0A2
C7C8B7

Deuteranopia

D7DC88
D8DB89
D4D695
D0D0A6
C6C4B9

Tritanopia

EE8F91
E89294
DD9EA0
CFAEB0
BEBEC0

Achromatopsia

BBBBBB
BFBFBF
C4C4C4
C9C9C9
C9C9C9

Shades & Tints Shades & Tints

#F1AC78

Dark
Light

#EBB775

Dark
Light

#DEC381

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1ac78;
  --color-2: #ebb775;
  --color-3: #dec381;
  --color-4: #cfd193;
  --color-5: #bdd5ad;
}

SCSS

$color-1: #f1ac78;
$color-2: #ebb775;
$color-3: #dec381;
$color-4: #cfd193;
$color-5: #bdd5ad;

TAILWIND

colors: {
  'brand-1': '#f1ac78',
  'brand-2': '#ebb775',
  'brand-3': '#dec381',
  'brand-4': '#cfd193',
  'brand-5': '#bdd5ad',
}

RGB Array

[241, 172, 120], [235, 183, 117], [222, 195, 129], [207, 209, 147], [189, 213, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1AC78, #EBB775, #DEC381, #CFD193, #BDD5AD 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: #f1ac78; --color-2: #ebb775; --color-3: #dec381; --color-4: #cfd193; --color-5: #bdd5ad. 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