#FFEB8C + #F1E89D + #C4D0AC + #6F9387 + #4F807D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#FFEB8C

Fresh Green · Khaki · Lemon Cream

HEX

#FFEB8C

RGB

rgb(255, 235, 140)

HSL

hsl(50, 100%, 77%)

HSB

hsb(50, 45%, 100%)

CMYK

cmyk(0%, 8%, 45%, 0%)

Oklch

oklch(93.6% 0.118 97.8)

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

#F1E89D

Fresh Green · Khaki · Lemon Cream

HEX

#F1E89D

RGB

rgb(241, 232, 157)

HSL

hsl(54, 75%, 78%)

HSB

hsb(54, 35%, 95%)

CMYK

cmyk(0%, 4%, 35%, 5%)

Oklch

oklch(92.1% 0.095 102.2)

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

#C4D0AC

Willow Green · Silver · Apple Green

HEX

#C4D0AC

RGB

rgb(196, 208, 172)

HSL

hsl(80, 28%, 75%)

HSB

hsb(80, 17%, 82%)

CMYK

cmyk(6%, 0%, 17%, 18%)

Oklch

oklch(83.9% 0.050 122.5)

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

#6F9387

Mineral Blue · SlateGray · Lake Green

HEX

#6F9387

RGB

rgb(111, 147, 135)

HSL

hsl(160, 14%, 51%)

HSB

hsb(160, 24%, 58%)

CMYK

cmyk(24%, 0%, 8%, 42%)

Oklch

oklch(63.3% 0.044 172.4)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#4F807D

Mineral Blue · SlateGray · Mint Ice

HEX

#4F807D

RGB

rgb(79, 128, 125)

HSL

hsl(176, 24%, 41%)

HSB

hsb(176, 38%, 50%)

CMYK

cmyk(38%, 0%, 2%, 50%)

Oklch

oklch(56.4% 0.053 190.8)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFEB8C

8A9DFF

Analogous

FFB18A

FFEB8C

D8FF8A

Triadic

FFEB8C

8AFFEB

EB8AFF

Split-Comp.

FFEB8C

8AD8FF

B18AFF

Tetradic

FFEB8C

8AFFB1

8A9DFF

FF8AD8

Contrast Matrix WCAG 2.1 Contrast

FFEB8C	F1E89D	C4D0AC	6F9387	4F807D
—	1.0 Fail	1.4 Fail	2.8 Fail	3.7 AA Large
1.0 Fail	—	1.3 Fail	2.7 Fail	3.6 AA Large
1.4 Fail	1.3 Fail	—	2.1 Fail	2.7 Fail
2.8 Fail	2.7 Fail	2.1 Fail	—	1.3 Fail
3.7 AA Large	3.6 AA Large	2.7 Fail	1.3 Fail	—

White BG

1.2Fail

1.3Fail

1.6Fail

3.4AA Large

4.5AA Large

Black BG

17.5AAA

16.8AAA

13.0AAA

6.2AA

4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F6F6A3

EDEDAF

C9C9B5

7F7F8A

64657E

Deuteranopia

F8F9A9

EEEEB4

C9C8B7

7D7A8B

615E7E

Tritanopia

FEB5B9

F1BDC1

C5BCBD

718C8D

517E7E

Achromatopsia

E6E6E6

E2E2E2

C8C8C8

878787

717171

Shades & Tints Shades & Tints

#FFEB8C

Dark

Light

#F1E89D

Dark

Light

#C4D0AC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffeb8c;
  --color-2: #f1e89d;
  --color-3: #c4d0ac;
  --color-4: #6f9387;
  --color-5: #4f807d;
}

SCSS

$color-1: #ffeb8c;
$color-2: #f1e89d;
$color-3: #c4d0ac;
$color-4: #6f9387;
$color-5: #4f807d;

TAILWIND

colors: {
  'brand-1': '#ffeb8c',
  'brand-2': '#f1e89d',
  'brand-3': '#c4d0ac',
  'brand-4': '#6f9387',
  'brand-5': '#4f807d',
}

RGB Array

[255, 235, 140], [241, 232, 157], [196, 208, 172], [111, 147, 135], [79, 128, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFEB8C, #F1E89D, #C4D0AC, #6F9387, #4F807D is ideal for: corporate websites, product showcases, portfolios. 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: #ffeb8c; --color-2: #f1e89d; --color-3: #c4d0ac; --color-4: #6f9387; --color-5: #4f807d. 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. 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