← Back to Editor

#B3D1C5 · #5B1027 · #84723D · #C2C5A9 · #F5F6EB

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#B3D1C5

Jade · Silver · Apple Green

HEX
#B3D1C5
RGB
rgb(179, 209, 197)
HSL
hsl(156, 25%, 76%)
HSB
hsb(156, 14%, 82%)
CMYK
cmyk(14%, 0%, 6%, 18%)
Oklch
oklch(83.5% 0.036 169.3)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

#5B1027

Dark Violet · Maroon · Raspberry

HEX
#5B1027
RGB
rgb(91, 16, 39)
HSL
hsl(342, 70%, 21%)
HSB
hsb(342, 82%, 36%)
CMYK
cmyk(0%, 82%, 57%, 64%)
Oklch
oklch(31.5% 0.107 8.1)

TraditionalDark Violet」· PaintRaspberry」· Creative Blush Sunrise

#84723D

Ochre · Sienna · Honey Gold

HEX
#84723D
RGB
rgb(132, 114, 61)
HSL
hsl(45, 37%, 38%)
HSB
hsb(45, 54%, 52%)
CMYK
cmyk(0%, 14%, 54%, 48%)
Oklch
oklch(55.7% 0.075 91.1)

TraditionalOchre」· PaintHoney Gold」· Creative Blush Sunrise

#C2C5A9

Fresh Green · Silver · Sunflower

HEX
#C2C5A9
RGB
rgb(194, 197, 169)
HSL
hsl(66, 19%, 72%)
HSB
hsb(66, 14%, 77%)
CMYK
cmyk(2%, 0%, 14%, 23%)
Oklch
oklch(81.4% 0.038 112.2)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#F5F6EB

Fresh Green · Linen · Lemon Cream

HEX
#F5F6EB
RGB
rgb(245, 246, 235)
HSL
hsl(65, 38%, 94%)
HSB
hsb(65, 4%, 96%)
CMYK
cmyk(0%, 0%, 4%, 4%)
Oklch
oklch(96.9% 0.015 110.9)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3D1C5
D1B3BF

Analogous

B3D1B6
B3D1C5
B3CED1

Triadic

B3D1C5
C5B3D1
D1C5B3

Split-Comp.

B3D1C5
D1B3CE
D1B6B3

Tetradic

B3D1C5
B6B3D1
D1B3BF
CED1B3

Contrast Matrix WCAG 2.1 Contrast

B3D1C5
5B1027
84723D
C2C5A9
F5F6EB
8.3
AAA
2.9
Fail
1.1
Fail
1.5
Fail
8.3
AAA
2.9
Fail
7.7
AAA
12.4
AAA
2.9
Fail
2.9
Fail
2.7
Fail
4.3
AA Large
1.1
Fail
7.7
AAA
2.7
Fail
1.6
Fail
1.5
Fail
12.4
AAA
4.3
AA Large
1.6
Fail
White BG
1.6Fail
13.6AAA
4.7AA
1.8Fail
1.1Fail
Black BG
12.8AAA
1.5Fail
4.5AA Large
11.9AAA
19.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C0C0C8
3B3A21
7C7C4A
C3C3B0
F5F5EE

Deuteranopia

BEBCC9
3F4520
7D7F4D
C3C3B1
F5F5EE

Tritanopia

B4CACB
571D1C
835456
C2B5B6
F5F0F0

Achromatopsia

C7C7C7
292929
717171
C1C1C1
F4F4F4

Shades & Tints Shades & Tints

#B3D1C5

Dark
Light

#5B1027

Dark
Light

#84723D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3d1c5;
  --color-2: #5b1027;
  --color-3: #84723d;
  --color-4: #c2c5a9;
  --color-5: #f5f6eb;
}

SCSS

$color-1: #b3d1c5;
$color-2: #5b1027;
$color-3: #84723d;
$color-4: #c2c5a9;
$color-5: #f5f6eb;

TAILWIND

colors: {
  'brand-1': '#b3d1c5',
  'brand-2': '#5b1027',
  'brand-3': '#84723d',
  'brand-4': '#c2c5a9',
  'brand-5': '#f5f6eb',
}

RGB Array

[179, 209, 197], [91, 16, 39], [132, 114, 61], [194, 197, 169], [245, 246, 235]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #B3D1C5, #5B1027, #84723D, #C2C5A9, #F5F6EB is ideal for: 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: #b3d1c5; --color-2: #5b1027; --color-3: #84723d; --color-4: #c2c5a9; --color-5: #f5f6eb. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 warm-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