#F9D47F + #E6712C + #E4F1B3 + #A0C9B5 + #7F9796 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F9D47F

Goose Yellow · Khaki · Sunflower

HEX

#F9D47F

RGB

rgb(249, 212, 127)

HSL

hsl(42, 91%, 74%)

HSB

hsb(42, 49%, 98%)

CMYK

cmyk(0%, 15%, 49%, 2%)

Oklch

oklch(88.4% 0.112 86.6)

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

#E6712C

Tangerine · Chocolate · Warm Sun

HEX

#E6712C

RGB

rgb(230, 113, 44)

HSL

hsl(22, 79%, 54%)

HSB

hsb(22, 81%, 90%)

CMYK

cmyk(0%, 51%, 81%, 10%)

Oklch

oklch(67.6% 0.165 47.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#E4F1B3

Willow Green · Wheat · Mint Green

HEX

#E4F1B3

RGB

rgb(228, 241, 179)

HSL

hsl(73, 69%, 82%)

HSB

hsb(73, 26%, 95%)

CMYK

cmyk(5%, 0%, 26%, 5%)

Oklch

oklch(93.3% 0.081 117.6)

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

#A0C9B5

Jade · Silver · Apple Green

HEX

#A0C9B5

RGB

rgb(160, 201, 181)

HSL

hsl(151, 28%, 71%)

HSB

hsb(151, 20%, 79%)

CMYK

cmyk(20%, 0%, 10%, 21%)

Oklch

oklch(80.1% 0.052 163.9)

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

#7F9796

Mineral Blue · LightSlateGray · Lake Green

HEX

#7F9796

RGB

rgb(127, 151, 150)

HSL

hsl(178, 10%, 55%)

HSB

hsb(178, 16%, 59%)

CMYK

cmyk(16%, 0%, 1%, 41%)

Oklch

oklch(65.7% 0.027 193.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9D47F

80A5F9

Analogous

F99980

F9D47F

E1F980

Triadic

F9D47F

80F9D5

D580F9

Split-Comp.

F9D47F

80E1F9

9980F9

Tetradic

F9D47F

80F999

80A5F9

F980E1

Contrast Matrix WCAG 2.1 Contrast

F9D47F	E6712C	E4F1B3	A0C9B5	7F9796
—	2.2 Fail	1.2 Fail	1.3 Fail	2.2 Fail
2.2 Fail	—	2.6 Fail	1.7 Fail	1.0 Fail
1.2 Fail	2.6 Fail	—	1.5 Fail	2.6 Fail
1.3 Fail	1.7 Fail	1.5 Fail	—	1.7 Fail
2.2 Fail	1.0 Fail	2.6 Fail	1.7 Fail	—

White BG

1.4Fail

3.1AA Large

1.2Fail

1.8Fail

3.1AA Large

Black BG

14.8AAA

6.8AA

17.5AAA

11.5AAA

6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E994

B3B23D

EAEAC2

B2B2BA

898A96

Deuteranopia

EBEE99

BAC341

E9E8C6

AFACBB

888696

Tritanopia

F7A4A7

E04A4D

E5CED0

A2BEBF

809696

Achromatopsia

D5D5D5

8C8C8C

E6E6E6

BABABA

909090

Shades & Tints Shades & Tints

#F9D47F

Dark

Light

#E6712C

Dark

Light

#E4F1B3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9d47f;
  --color-2: #e6712c;
  --color-3: #e4f1b3;
  --color-4: #a0c9b5;
  --color-5: #7f9796;
}

SCSS

$color-1: #f9d47f;
$color-2: #e6712c;
$color-3: #e4f1b3;
$color-4: #a0c9b5;
$color-5: #7f9796;

TAILWIND

colors: {
  'brand-1': '#f9d47f',
  'brand-2': '#e6712c',
  'brand-3': '#e4f1b3',
  'brand-4': '#a0c9b5',
  'brand-5': '#7f9796',
}

RGB Array

[249, 212, 127], [230, 113, 44], [228, 241, 179], [160, 201, 181], [127, 151, 150]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F9D47F, #E6712C, #E4F1B3, #A0C9B5, #7F9796 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: #f9d47f; --color-2: #e6712c; --color-3: #e4f1b3; --color-4: #a0c9b5; --color-5: #7f9796. 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