← Back to Editor

#F26B93 · #CB8DB4 · #AFC4CE · #BFCFC9 · #8FC1BD

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F26B93

Rouge · LightCoral · Rose Pink

HEX
#F26B93
RGB
rgb(242, 107, 147)
HSL
hsl(342, 84%, 68%)
HSB
hsb(342, 56%, 95%)
CMYK
cmyk(0%, 56%, 39%, 5%)
Oklch
oklch(70.2% 0.170 3.9)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#CB8DB4

Mauve · DarkGray · Rose Pink

HEX
#CB8DB4
RGB
rgb(203, 141, 180)
HSL
hsl(322, 37%, 67%)
HSB
hsb(322, 31%, 80%)
CMYK
cmyk(0%, 31%, 11%, 20%)
Oklch
oklch(71.7% 0.091 341.5)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#AFC4CE

Sky Blue · LightSteelBlue · Lake Green

HEX
#AFC4CE
RGB
rgb(175, 196, 206)
HSL
hsl(199, 24%, 75%)
HSB
hsb(199, 15%, 81%)
CMYK
cmyk(15%, 5%, 0%, 19%)
Oklch
oklch(80.8% 0.027 228.0)

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

#BFCFC9

Jade · Silver · Apple Green

HEX
#BFCFC9
RGB
rgb(191, 207, 201)
HSL
hsl(157, 14%, 78%)
HSB
hsb(157, 8%, 81%)
CMYK
cmyk(8%, 0%, 3%, 19%)
Oklch
oklch(84.1% 0.019 171.4)

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

#8FC1BD

Jade · DarkGray · Lake Green

HEX
#8FC1BD
RGB
rgb(143, 193, 189)
HSL
hsl(175, 29%, 66%)
HSB
hsb(175, 26%, 76%)
CMYK
cmyk(26%, 0%, 2%, 24%)
Oklch
oklch(77.5% 0.053 190.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F26B93
69F2C9

Analogous

F269D7
F26B93
F28469

Triadic

F26B93
92F269
6992F2

Split-Comp.

F26B93
69F284
69D7F2

Tetradic

F26B93
D7F269
69F2C9
8469F2

Contrast Matrix WCAG 2.1 Contrast

F26B93
CB8DB4
AFC4CE
BFCFC9
8FC1BD
—
1.1
Fail
1.6
Fail
1.8
Fail
1.4
Fail
1.1
Fail
—
1.4
Fail
1.6
Fail
1.3
Fail
1.6
Fail
1.4
Fail
—
1.1
Fail
1.1
Fail
1.8
Fail
1.6
Fail
1.1
Fail
—
1.2
Fail
1.4
Fail
1.3
Fail
1.1
Fail
1.2
Fail
—
White BG
2.9Fail
2.6Fail
1.8Fail
1.6Fail
2.0Fail
Black BG
7.3AAA
8.0AAA
11.6AAA
13.0AAA
10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B689
B0B0AB
B8B8CC
C6C6CA
A5A5BE

Deuteranopia

BFC987
B4B8A8
B7B5CB
C5C4CB
A29EBE

Tritanopia

EB8280
C8A3A1
B0CAC9
C0CCCC
92BFBF

Achromatopsia

989898
A4A4A4
BFBFBF
CACACA
B2B2B2

Shades & Tints Shades & Tints

#F26B93

Dark
Light

#CB8DB4

Dark
Light

#AFC4CE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f26b93;
  --color-2: #cb8db4;
  --color-3: #afc4ce;
  --color-4: #bfcfc9;
  --color-5: #8fc1bd;
}

SCSS

$color-1: #f26b93;
$color-2: #cb8db4;
$color-3: #afc4ce;
$color-4: #bfcfc9;
$color-5: #8fc1bd;

TAILWIND

colors: {
  'brand-1': '#f26b93',
  'brand-2': '#cb8db4',
  'brand-3': '#afc4ce',
  'brand-4': '#bfcfc9',
  'brand-5': '#8fc1bd',
}

RGB Array

[242, 107, 147], [203, 141, 180], [175, 196, 206], [191, 207, 201], [143, 193, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F26B93, #CB8DB4, #AFC4CE, #BFCFC9, #8FC1BD 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: #f26b93; --color-2: #cb8db4; --color-3: #afc4ce; --color-4: #bfcfc9; --color-5: #8fc1bd. 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