#F8736C + #D47A7A + #CE99A1 + #CDBAA9 + #B1E6DE - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F8736C

Peach Pink · Salmon · Coral Red

HEX

#F8736C

RGB

rgb(248, 115, 108)

HSL

hsl(3, 91%, 70%)

HSB

hsb(3, 56%, 97%)

CMYK

cmyk(0%, 54%, 56%, 3%)

Oklch

oklch(71.2% 0.165 25.1)

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

#D47A7A

Peach Pink · LightCoral · Coral Red

HEX

#D47A7A

RGB

rgb(212, 122, 122)

HSL

hsl(0, 51%, 65%)

HSB

hsb(0, 42%, 83%)

CMYK

cmyk(0%, 42%, 42%, 17%)

Oklch

oklch(67.8% 0.112 20.4)

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

#CE99A1

Peach Pink · Tan · Coral Red

HEX

#CE99A1

RGB

rgb(206, 153, 161)

HSL

hsl(351, 35%, 70%)

HSB

hsb(351, 26%, 81%)

CMYK

cmyk(0%, 26%, 22%, 19%)

Oklch

oklch(73.5% 0.064 8.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#CDBAA9

Apricot · Silver · Warm Sun

HEX

#CDBAA9

RGB

rgb(205, 186, 169)

HSL

hsl(28, 26%, 73%)

HSB

hsb(28, 18%, 80%)

CMYK

cmyk(0%, 9%, 18%, 20%)

Oklch

oklch(80.0% 0.032 64.2)

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

#B1E6DE

Jade · LightBlue · Glacier Blue

HEX

#B1E6DE

RGB

rgb(177, 230, 222)

HSL

hsl(171, 51%, 80%)

HSB

hsb(171, 23%, 90%)

CMYK

cmyk(23%, 0%, 3%, 10%)

Oklch

oklch(88.6% 0.055 184.8)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8736C

6DF1F8

Analogous

F86DAC

F8736C

F8B96D

Triadic

F8736C

6DF874

746DF8

Split-Comp.

F8736C

6DF8B9

6DACF8

Tetradic

F8736C

ACF86D

6DF1F8

B96DF8

Contrast Matrix WCAG 2.1 Contrast

F8736C	D47A7A	CE99A1	CDBAA9	B1E6DE
—	1.1 Fail	1.1 Fail	1.5 Fail	2.0 Fail
1.1 Fail	—	1.3 Fail	1.6 Fail	2.2 Fail
1.1 Fail	1.3 Fail	—	1.3 Fail	1.8 Fail
1.5 Fail	1.6 Fail	1.3 Fail	—	1.4 Fail
2.0 Fail	2.2 Fail	1.8 Fail	1.4 Fail	—

White BG

2.7Fail

3.1AA Large

2.4Fail

1.9Fail

1.4Fail

Black BG

7.7AAA

6.9AA

8.7AAA

11.2AAA

15.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBD6E

ADAC7A

B7B79F

C5C5AD

C8C8E0

Deuteranopia

C6D06E

B2B97A

BABE9F

C6C7AE

C5C1E0

Tritanopia

F16F6F

CF7A7A

CB9E9D

CCB0B1

B4E1E2

Achromatopsia

9A9A9A

959595

AAAAAA

BEBEBE

D5D5D5

Shades & Tints Shades & Tints

#F8736C

Dark

Light

#D47A7A

Dark

Light

#CE99A1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8736c;
  --color-2: #d47a7a;
  --color-3: #ce99a1;
  --color-4: #cdbaa9;
  --color-5: #b1e6de;
}

SCSS

$color-1: #f8736c;
$color-2: #d47a7a;
$color-3: #ce99a1;
$color-4: #cdbaa9;
$color-5: #b1e6de;

TAILWIND

colors: {
  'brand-1': '#f8736c',
  'brand-2': '#d47a7a',
  'brand-3': '#ce99a1',
  'brand-4': '#cdbaa9',
  'brand-5': '#b1e6de',
}

RGB Array

[248, 115, 108], [212, 122, 122], [206, 153, 161], [205, 186, 169], [177, 230, 222]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F8736C, #D47A7A, #CE99A1, #CDBAA9, #B1E6DE 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: #f8736c; --color-2: #d47a7a; --color-3: #ce99a1; --color-4: #cdbaa9; --color-5: #b1e6de. 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