← Back to Editor

#B7DBB7 · #F8EED3 · #BF9692 · #893E5F · #FB7310

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#B7DBB7

Celadon · Silver · Apple Green

HEX
#B7DBB7
RGB
rgb(183, 219, 183)
HSL
hsl(120, 33%, 79%)
HSB
hsb(120, 16%, 86%)
CMYK
cmyk(16%, 0%, 16%, 14%)
Oklch
oklch(85.6% 0.062 145.0)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#F8EED3

Goose Yellow · Beige · Lemon Cream

HEX
#F8EED3
RGB
rgb(248, 238, 211)
HSL
hsl(44, 73%, 90%)
HSB
hsb(44, 15%, 97%)
CMYK
cmyk(0%, 4%, 15%, 3%)
Oklch
oklch(95.0% 0.037 90.1)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#BF9692

Peach Pink · Tan · Coral Red

HEX
#BF9692
RGB
rgb(191, 150, 146)
HSL
hsl(5, 26%, 66%)
HSB
hsb(5, 24%, 75%)
CMYK
cmyk(0%, 21%, 24%, 25%)
Oklch
oklch(71.0% 0.050 24.8)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#893E5F

Dark Violet · DimGray · Camellia

HEX
#893E5F
RGB
rgb(137, 62, 95)
HSL
hsl(334, 38%, 39%)
HSB
hsb(334, 55%, 54%)
CMYK
cmyk(0%, 55%, 31%, 46%)
Oklch
oklch(47.2% 0.109 354.5)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

#FB7310

Tangerine · Chocolate · Warm Sun

HEX
#FB7310
RGB
rgb(251, 115, 16)
HSL
hsl(25, 97%, 52%)
HSB
hsb(25, 94%, 98%)
CMYK
cmyk(0%, 54%, 94%, 2%)
Oklch
oklch(70.8% 0.189 47.7)

TraditionalTangerine」· PaintWarm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B7DBB7
DBB8DB

Analogous

C9DBB8
B7DBB7
B8DBC9

Triadic

B7DBB7
B8B8DB
DBB8B8

Split-Comp.

B7DBB7
C9B8DB
DBB8C9

Tetradic

B7DBB7
B8C9DB
DBB8DB
DBC9B8

Contrast Matrix WCAG 2.1 Contrast

B7DBB7
F8EED3
BF9692
893E5F
FB7310
1.3
Fail
1.7
Fail
4.7
AA
1.8
Fail
1.3
Fail
2.3
Fail
6.2
AA
2.4
Fail
1.7
Fail
2.3
Fail
2.7
Fail
1.1
Fail
4.7
AA
6.2
AA
2.7
Fail
2.6
Fail
1.8
Fail
2.4
Fail
1.1
Fail
2.6
Fail
White BG
1.5Fail
1.2Fail
2.6Fail
7.2AAA
2.8Fail
Black BG
13.8AAA
18.2AAA
8.0AAA
2.9Fail
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C7C0
F4F4DA
ADAD93
696857
C0BF28

Deuteranopia

C5C2C2
F4F5DB
B0B393
6D7255
C8D22E

Tritanopia

B9C7C8
F8DFE0
BD9494
85514F
F43B3F

Achromatopsia

CCCCCC
EEEEEE
A2A2A2
585858
909090

Shades & Tints Shades & Tints

#B7DBB7

Dark
Light

#F8EED3

Dark
Light

#BF9692

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b7dbb7;
  --color-2: #f8eed3;
  --color-3: #bf9692;
  --color-4: #893e5f;
  --color-5: #fb7310;
}

SCSS

$color-1: #b7dbb7;
$color-2: #f8eed3;
$color-3: #bf9692;
$color-4: #893e5f;
$color-5: #fb7310;

TAILWIND

colors: {
  'brand-1': '#b7dbb7',
  'brand-2': '#f8eed3',
  'brand-3': '#bf9692',
  'brand-4': '#893e5f',
  'brand-5': '#fb7310',
}

RGB Array

[183, 219, 183], [248, 238, 211], [191, 150, 146], [137, 62, 95], [251, 115, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B7DBB7, #F8EED3, #BF9692, #893E5F, #FB7310 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #b7dbb7; --color-2: #f8eed3; --color-3: #bf9692; --color-4: #893e5f; --color-5: #fb7310. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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