#F1F18D + #CBD085 + #A5B07D + #7F8E75 + #596D6D · muted - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#F1F18D

Fresh Green · Khaki · Sunflower

HEX

#F1F18D

RGB

rgb(241, 241, 141)

HSL

hsl(60, 78%, 75%)

HSB

hsb(60, 41%, 95%)

CMYK

cmyk(0%, 0%, 41%, 5%)

Oklch

oklch(93.7% 0.123 108.6)

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

#CBD085

Fresh Green · Tan · Sunflower

HEX

#CBD085

RGB

rgb(203, 208, 133)

HSL

hsl(64, 44%, 67%)

HSB

hsb(64, 36%, 82%)

CMYK

cmyk(2%, 0%, 36%, 18%)

Oklch

oklch(83.6% 0.097 111.6)

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

#A5B07D

Grass Green · DarkSeaGreen · Olive Green

HEX

#A5B07D

RGB

rgb(165, 176, 125)

HSL

hsl(73, 24%, 59%)

HSB

hsb(73, 29%, 69%)

CMYK

cmyk(6%, 0%, 29%, 31%)

Oklch

oklch(73.6% 0.071 118.1)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#7F8E75

Celadon · Gray · Olive Green

HEX

#7F8E75

RGB

rgb(127, 142, 117)

HSL

hsl(96, 10%, 51%)

HSB

hsb(96, 18%, 56%)

CMYK

cmyk(11%, 0%, 18%, 44%)

Oklch

oklch(62.7% 0.041 132.9)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#596D6D

Slate Blue · DimGray · Mint Ice

HEX

#596D6D

RGB

rgb(89, 109, 109)

HSL

hsl(180, 10%, 39%)

HSB

hsb(180, 18%, 43%)

CMYK

cmyk(18%, 0%, 0%, 57%)

Oklch

oklch(51.8% 0.024 196.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1F18D

8E8EF1

Analogous

F1BF8E

F1F18D

BFF18E

Triadic

F1F18D

8EF1F1

F18EF1

Split-Comp.

F1F18D

8EBFF1

BF8EF1

Tetradic

F1F18D

8EF1BF

8E8EF1

F18EBF

Contrast Matrix WCAG 2.1 Contrast

F1F18D	CBD085	A5B07D	7F8E75	596D6D
—	1.4 Fail	1.9 Fail	2.9 Fail	4.6 AA
1.4 Fail	—	1.4 Fail	2.1 Fail	3.4 AA Large
1.9 Fail	1.4 Fail	—	1.5 Fail	2.4 Fail
2.9 Fail	2.1 Fail	1.5 Fail	—	1.6 Fail
4.6 AA	3.4 AA Large	2.4 Fail	1.6 Fail	—

White BG

1.2Fail

1.6Fail

2.3Fail

3.5AA Large

5.5AA

Black BG

17.7AAA

12.9AAA

9.1AAA

6.0AA

3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F1A5

CDCD97

AAAA89

85867B

62626D

Deuteranopia

F1F1AB

CDCD9C

A9A88C

85847D

615F6D

Tritanopia

F1B8BD

CBA5A9

A69395

808081

5A6D6D

Achromatopsia

E6E6E6

C6C6C6

A7A7A7

878787

676767

Shades & Tints Shades & Tints

#F1F18D

Dark

Light

#CBD085

Dark

Light

#A5B07D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1f18d;
  --color-2: #cbd085;
  --color-3: #a5b07d;
  --color-4: #7f8e75;
  --color-5: #596d6d;
}

SCSS

$color-1: #f1f18d;
$color-2: #cbd085;
$color-3: #a5b07d;
$color-4: #7f8e75;
$color-5: #596d6d;

TAILWIND

colors: {
  'brand-1': '#f1f18d',
  'brand-2': '#cbd085',
  'brand-3': '#a5b07d',
  'brand-4': '#7f8e75',
  'brand-5': '#596d6d',
}

RGB Array

[241, 241, 141], [203, 208, 133], [165, 176, 125], [127, 142, 117], [89, 109, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This muted-style palette of #F1F18D, #CBD085, #A5B07D, #7F8E75, #596D6D 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: #f1f18d; --color-2: #cbd085; --color-3: #a5b07d; --color-4: #7f8e75; --color-5: #596d6d. 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 muted-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