#F1BAAC + #C0D1AC + #C9BC96 + #D69F7B + #F26665 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F1BAAC

Peach Pink · LightPink · Cherry Blossom

HEX

#F1BAAC

RGB

rgb(241, 186, 172)

HSL

hsl(12, 71%, 81%)

HSB

hsb(12, 29%, 95%)

CMYK

cmyk(0%, 23%, 29%, 5%)

Oklch

oklch(83.5% 0.067 34.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#C0D1AC

Willow Green · Silver · Apple Green

HEX

#C0D1AC

RGB

rgb(192, 209, 172)

HSL

hsl(88, 29%, 75%)

HSB

hsb(88, 18%, 82%)

CMYK

cmyk(8%, 0%, 18%, 18%)

Oklch

oklch(83.8% 0.053 127.6)

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

#C9BC96

Ginger · Tan · Sunflower

HEX

#C9BC96

RGB

rgb(201, 188, 150)

HSL

hsl(45, 32%, 69%)

HSB

hsb(45, 25%, 79%)

CMYK

cmyk(0%, 6%, 25%, 21%)

Oklch

oklch(79.6% 0.053 91.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#D69F7B

Apricot · DarkSalmon · Warm Sun

HEX

#D69F7B

RGB

rgb(214, 159, 123)

HSL

hsl(24, 53%, 66%)

HSB

hsb(24, 43%, 84%)

CMYK

cmyk(0%, 26%, 43%, 16%)

Oklch

oklch(74.6% 0.082 54.3)

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

#F26665

Peach Pink · Salmon · Coral Red

HEX

#F26665

RGB

rgb(242, 102, 101)

HSL

hsl(0, 84%, 67%)

HSB

hsb(0, 58%, 95%)

CMYK

cmyk(0%, 58%, 58%, 5%)

Oklch

oklch(68.5% 0.173 23.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1BAAC

ACE3F1

Analogous

F1ACC1

F1BAAC

F1DCAC

Triadic

F1BAAC

ACF1BA

BAACF1

Split-Comp.

F1BAAC

ACF1DC

ACC1F1

Tetradic

F1BAAC

C1F1AC

ACE3F1

DCACF1

Contrast Matrix WCAG 2.1 Contrast

F1BAAC	C0D1AC	C9BC96	D69F7B	F26665
—	1.0 Fail	1.1 Fail	1.4 Fail	1.8 Fail
1.0 Fail	—	1.2 Fail	1.4 Fail	1.9 Fail
1.1 Fail	1.2 Fail	—	1.2 Fail	1.6 Fail
1.4 Fail	1.4 Fail	1.2 Fail	—	1.3 Fail
1.8 Fail	1.9 Fail	1.6 Fail	1.3 Fail	—

White BG

1.7Fail

1.6Fail

1.9Fail

2.3Fail

3.1AA Large

Black BG

12.4AAA

13.0AAA

11.1AAA

9.1AAA

6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D9AF

C7C8B5

C3C39F

BEBE84

B5B465

Deuteranopia

DCE1B0

C6C5B7

C4C5A1

C1C586

BEC865

Tritanopia

EEB2B3

C1BCBE

C8A6A8

D38B8C

EB6565

Achromatopsia

C9C9C9

C8C8C8

BCBCBC

ABABAB

909090

Shades & Tints Shades & Tints

#F1BAAC

Dark

Light

#C0D1AC

Dark

Light

#C9BC96

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1baac;
  --color-2: #c0d1ac;
  --color-3: #c9bc96;
  --color-4: #d69f7b;
  --color-5: #f26665;
}

SCSS

$color-1: #f1baac;
$color-2: #c0d1ac;
$color-3: #c9bc96;
$color-4: #d69f7b;
$color-5: #f26665;

TAILWIND

colors: {
  'brand-1': '#f1baac',
  'brand-2': '#c0d1ac',
  'brand-3': '#c9bc96',
  'brand-4': '#d69f7b',
  'brand-5': '#f26665',
}

RGB Array

[241, 186, 172], [192, 209, 172], [201, 188, 150], [214, 159, 123], [242, 102, 101]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1BAAC, #C0D1AC, #C9BC96, #D69F7B, #F26665 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: #f1baac; --color-2: #c0d1ac; --color-3: #c9bc96; --color-4: #d69f7b; --color-5: #f26665. 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