#F07C5E + #FFEF89 + #EBEBBB + #C5D7BB + #8CAFB0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F07C5E

Peach Pink · Coral · Coral Red

HEX

#F07C5E

RGB

rgb(240, 124, 94)

HSL

hsl(12, 83%, 65%)

HSB

hsb(12, 61%, 94%)

CMYK

cmyk(0%, 48%, 61%, 6%)

Oklch

oklch(71.2% 0.150 35.5)

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

#FFEF89

Fresh Green · Khaki · Lemon Cream

HEX

#FFEF89

RGB

rgb(255, 239, 137)

HSL

hsl(52, 100%, 77%)

HSB

hsb(52, 46%, 100%)

CMYK

cmyk(0%, 6%, 46%, 0%)

Oklch

oklch(94.4% 0.124 100.5)

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

#EBEBBB

Fresh Green · Wheat · Lemon Cream

HEX

#EBEBBB

RGB

rgb(235, 235, 187)

HSL

hsl(60, 55%, 83%)

HSB

hsb(60, 20%, 92%)

CMYK

cmyk(0%, 0%, 20%, 8%)

Oklch

oklch(92.8% 0.062 107.6)

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

#C5D7BB

Celadon · Silver · Apple Green

HEX

#C5D7BB

RGB

rgb(197, 215, 187)

HSL

hsl(99, 26%, 79%)

HSB

hsb(99, 13%, 84%)

CMYK

cmyk(8%, 0%, 13%, 16%)

Oklch

oklch(85.8% 0.043 134.3)

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

#8CAFB0

Sky Blue · DarkGray · Lake Green

HEX

#8CAFB0

RGB

rgb(140, 175, 176)

HSL

hsl(182, 19%, 62%)

HSB

hsb(182, 20%, 69%)

CMYK

cmyk(20%, 1%, 0%, 31%)

Oklch

oklch(72.9% 0.038 198.5)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F07C5E

5CD2F0

Analogous

F05C88

F07C5E

F0C35C

Triadic

F07C5E

5CF079

795CF0

Split-Comp.

F07C5E

5CF0C3

5C88F0

Tetradic

F07C5E

88F05C

5CD2F0

C35CF0

Contrast Matrix WCAG 2.1 Contrast

F07C5E	FFEF89	EBEBBB	C5D7BB	8CAFB0
—	2.3 Fail	2.2 Fail	1.8 Fail	1.1 Fail
2.3 Fail	—	1.0 Fail	1.3 Fail	2.0 Fail
2.2 Fail	1.0 Fail	—	1.2 Fail	1.9 Fail
1.8 Fail	1.3 Fail	1.2 Fail	—	1.6 Fail
1.1 Fail	2.0 Fail	1.9 Fail	1.6 Fail	—

White BG

2.7Fail

1.2Fail

1.5Fail

2.4Fail

Black BG

7.7AAA

18.0AAA

17.1AAA

13.8AAA

8.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBD65

F8F8A2

EBEBC7

CDCDC2

9B9BB0

Deuteranopia

C5CD67

F9FAA8

EBEBC9

CCCAC3

9997B0

Tritanopia

EA6B6C

FEB5B9

EBD0D2

C6C7C8

8EB0B0

Achromatopsia

9B9B9B

E8E8E8

E6E6E6

CECECE

A5A5A5

Shades & Tints Shades & Tints

#F07C5E

Dark

Light

#FFEF89

Dark

Light

#EBEBBB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f07c5e;
  --color-2: #ffef89;
  --color-3: #ebebbb;
  --color-4: #c5d7bb;
  --color-5: #8cafb0;
}

SCSS

$color-1: #f07c5e;
$color-2: #ffef89;
$color-3: #ebebbb;
$color-4: #c5d7bb;
$color-5: #8cafb0;

TAILWIND

colors: {
  'brand-1': '#f07c5e',
  'brand-2': '#ffef89',
  'brand-3': '#ebebbb',
  'brand-4': '#c5d7bb',
  'brand-5': '#8cafb0',
}

RGB Array

[240, 124, 94], [255, 239, 137], [235, 235, 187], [197, 215, 187], [140, 175, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F07C5E, #FFEF89, #EBEBBB, #C5D7BB, #8CAFB0 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: #f07c5e; --color-2: #ffef89; --color-3: #ebebbb; --color-4: #c5d7bb; --color-5: #8cafb0. 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