#BF3F52 + #C99769 + #C7C18D + #D0DEC1 + #DEE6D3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BF3F52

Crimson · Sienna · Passion Red

HEX

#BF3F52

RGB

rgb(191, 63, 82)

HSL

hsl(351, 50%, 50%)

HSB

hsb(351, 67%, 75%)

CMYK

cmyk(0%, 67%, 57%, 25%)

Oklch

oklch(55.5% 0.163 15.6)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#C99769

Tangerine · DarkSalmon · Warm Sun

HEX

#C99769

RGB

rgb(201, 151, 105)

HSL

hsl(29, 47%, 60%)

HSB

hsb(29, 48%, 79%)

CMYK

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

Oklch

oklch(71.3% 0.086 63.4)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#C7C18D

Fresh Green · Tan · Sunflower

HEX

#C7C18D

RGB

rgb(199, 193, 141)

HSL

hsl(54, 34%, 67%)

HSB

hsb(54, 29%, 78%)

CMYK

cmyk(0%, 3%, 29%, 22%)

Oklch

oklch(80.3% 0.069 102.3)

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

#D0DEC1

Willow Green · LightGray · Mint Green

HEX

#D0DEC1

RGB

rgb(208, 222, 193)

HSL

hsl(89, 31%, 81%)

HSB

hsb(89, 13%, 87%)

CMYK

cmyk(6%, 0%, 13%, 13%)

Oklch

oklch(88.2% 0.042 128.3)

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

#DEE6D3

Willow Green · LightGray · Mint Green

HEX

#DEE6D3

RGB

rgb(222, 230, 211)

HSL

hsl(85, 28%, 86%)

HSB

hsb(85, 8%, 90%)

CMYK

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

Oklch

oklch(91.4% 0.027 125.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BF3F52

40BFAC

Analogous

BF4093

BF3F52

BF6C40

Triadic

BF3F52

53BF40

4053BF

Split-Comp.

BF3F52

40BF6C

4093BF

Tetradic

BF3F52

93BF40

40BFAC

6C40BF

Contrast Matrix WCAG 2.1 Contrast

BF3F52	C99769	C7C18D	D0DEC1	DEE6D3
—	2.0 Fail	2.8 Fail	3.7 AA Large	4.0 AA Large
2.0 Fail	—	1.4 Fail	1.8 Fail	2.0 Fail
2.8 Fail	1.4 Fail	—	1.3 Fail	1.4 Fail
3.7 AA Large	1.8 Fail	1.3 Fail	—	1.1 Fail
4.0 AA Large	2.0 Fail	1.4 Fail	1.1 Fail	—

White BG

5.2AA

2.6Fail

1.8Fail

1.4Fail

1.3Fail

Black BG

4.0AA Large

8.1AAA

11.4AAA

14.9AAA

16.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

88864D

B3B374

C4C49A

D6D6C8

E1E2D8

Deuteranopia

8F994C

B6BA77

C5C59D

D5D4CA

E1E0D9

Tritanopia

B94A49

C77D7F

C7A4A6

D1CECF

DEDBDC

Achromatopsia

676767

A1A1A1

BDBDBD

D7D7D7

E1E1E1

Shades & Tints Shades & Tints

#BF3F52

Dark

Light

#C99769

Dark

Light

#C7C18D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bf3f52;
  --color-2: #c99769;
  --color-3: #c7c18d;
  --color-4: #d0dec1;
  --color-5: #dee6d3;
}

SCSS

$color-1: #bf3f52;
$color-2: #c99769;
$color-3: #c7c18d;
$color-4: #d0dec1;
$color-5: #dee6d3;

TAILWIND

colors: {
  'brand-1': '#bf3f52',
  'brand-2': '#c99769',
  'brand-3': '#c7c18d',
  'brand-4': '#d0dec1',
  'brand-5': '#dee6d3',
}

RGB Array

[191, 63, 82], [201, 151, 105], [199, 193, 141], [208, 222, 193], [222, 230, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BF3F52, #C99769, #C7C18D, #D0DEC1, #DEE6D3 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: #bf3f52; --color-2: #c99769; --color-3: #c7c18d; --color-4: #d0dec1; --color-5: #dee6d3. 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