#F6A1B4 + #F68DA4 + #D4DEA0 + #C5DAAC + #A5DACD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F6A1B4

Peach Pink · LightPink · Coral Red

HEX

#F6A1B4

RGB

rgb(246, 161, 180)

HSL

hsl(347, 83%, 80%)

HSB

hsb(347, 35%, 96%)

CMYK

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

Oklch

oklch(79.8% 0.103 5.1)

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

#F68DA4

Peach Pink · LightCoral · Coral Red

HEX

#F68DA4

RGB

rgb(246, 141, 164)

HSL

hsl(347, 85%, 76%)

HSB

hsb(347, 43%, 96%)

CMYK

cmyk(0%, 43%, 33%, 4%)

Oklch

oklch(76.1% 0.129 6.5)

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

#D4DEA0

Willow Green · Khaki · Apple Green

HEX

#D4DEA0

RGB

rgb(212, 222, 160)

HSL

hsl(70, 48%, 75%)

HSB

hsb(70, 28%, 87%)

CMYK

cmyk(5%, 0%, 28%, 13%)

Oklch

oklch(87.8% 0.082 115.6)

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

#C5DAAC

Willow Green · Silver · Apple Green

HEX

#C5DAAC

RGB

rgb(197, 218, 172)

HSL

hsl(87, 38%, 76%)

HSB

hsb(87, 21%, 85%)

CMYK

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

Oklch

oklch(86.1% 0.066 127.7)

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

#A5DACD

Jade · LightBlue · Lake Green

HEX

#A5DACD

RGB

rgb(165, 218, 205)

HSL

hsl(165, 42%, 75%)

HSB

hsb(165, 24%, 85%)

CMYK

cmyk(24%, 0%, 6%, 15%)

Oklch

oklch(84.8% 0.058 178.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6A1B4

A2F6E4

Analogous

F6A2DE

F6A1B4

F6BAA2

Triadic

F6A1B4

B4F6A2

A2B4F6

Split-Comp.

F6A1B4

A2F6BA

A2DEF6

Tetradic

F6A1B4

DEF6A2

A2F6E4

BAA2F6

Contrast Matrix WCAG 2.1 Contrast

F6A1B4	F68DA4	D4DEA0	C5DAAC	A5DACD
—	1.2 Fail	1.4 Fail	1.3 Fail	1.3 Fail
1.2 Fail	—	1.6 Fail	1.5 Fail	1.5 Fail
1.4 Fail	1.6 Fail	—	1.1 Fail	1.1 Fail
1.3 Fail	1.5 Fail	1.1 Fail	—	1.0 Fail
1.3 Fail	1.5 Fail	1.1 Fail	1.0 Fail	—

White BG

2.0Fail

2.3Fail

1.4Fail

1.5Fail

1.6Fail

Black BG

10.7AAA

9.3AAA

14.8AAA

14.0AAA

13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D0AF

C9C89E

D8D8AF

CECEB7

BCBCD0

Deuteranopia

D6DDAE

CFD79D

D8D7B3

CDCBBA

B9B5D1

Tritanopia

F2ACAB

F19A99

D4BBBD

C6C0C2

A8D3D3

Achromatopsia

BDBDBD

AFAFAF

D4D4D4

CECECE

C9C9C9

Shades & Tints Shades & Tints

#F6A1B4

Dark

Light

#F68DA4

Dark

Light

#D4DEA0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6a1b4;
  --color-2: #f68da4;
  --color-3: #d4dea0;
  --color-4: #c5daac;
  --color-5: #a5dacd;
}

SCSS

$color-1: #f6a1b4;
$color-2: #f68da4;
$color-3: #d4dea0;
$color-4: #c5daac;
$color-5: #a5dacd;

TAILWIND

colors: {
  'brand-1': '#f6a1b4',
  'brand-2': '#f68da4',
  'brand-3': '#d4dea0',
  'brand-4': '#c5daac',
  'brand-5': '#a5dacd',
}

RGB Array

[246, 161, 180], [246, 141, 164], [212, 222, 160], [197, 218, 172], [165, 218, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6A1B4, #F68DA4, #D4DEA0, #C5DAAC, #A5DACD 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: #f6a1b4; --color-2: #f68da4; --color-3: #d4dea0; --color-4: #c5daac; --color-5: #a5dacd. 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