← Back to Editor

#514A38 · #E7545A · #BFD9B6 · #C9EBC6 · #97D7B2

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#514A38

Ochre · DarkOliveGreen · Honey Gold

HEX
#514A38
RGB
rgb(81, 74, 56)
HSL
hsl(43, 18%, 27%)
HSB
hsb(43, 31%, 32%)
CMYK
cmyk(0%, 9%, 31%, 68%)
Oklch
oklch(41.1% 0.030 89.3)

TraditionalOchre」· PaintHoney Gold」· Creative Blush Sunrise

#E7545A

Peach Pink · Tomato · Coral Red

HEX
#E7545A
RGB
rgb(231, 84, 90)
HSL
hsl(358, 75%, 62%)
HSB
hsb(358, 64%, 91%)
CMYK
cmyk(0%, 64%, 61%, 9%)
Oklch
oklch(64.4% 0.182 21.5)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#BFD9B6

Celadon · Silver · Apple Green

HEX
#BFD9B6
RGB
rgb(191, 217, 182)
HSL
hsl(105, 32%, 78%)
HSB
hsb(105, 16%, 85%)
CMYK
cmyk(12%, 0%, 16%, 15%)
Oklch
oklch(85.7% 0.055 137.7)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#C9EBC6

Celadon · LightGray · Mint Green

HEX
#C9EBC6
RGB
rgb(201, 235, 198)
HSL
hsl(115, 48%, 85%)
HSB
hsb(115, 16%, 92%)
CMYK
cmyk(14%, 0%, 16%, 8%)
Oklch
oklch(90.6% 0.061 142.9)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#97D7B2

Celadon · LightGreen · Apple Green

HEX
#97D7B2
RGB
rgb(151, 215, 178)
HSL
hsl(145, 44%, 72%)
HSB
hsb(145, 30%, 84%)
CMYK
cmyk(30%, 0%, 17%, 16%)
Oklch
oklch(82.6% 0.084 158.6)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

514A38
383F51

Analogous

513E38
514A38
4C5138

Triadic

514A38
38514A
4A3851

Split-Comp.

514A38
384C51
3E3851

Tetradic

514A38
38513E
383F51
51384C

Contrast Matrix WCAG 2.1 Contrast

514A38
E7545A
BFD9B6
C9EBC6
97D7B2
2.4
Fail
5.8
AA
6.8
AA
5.3
AA
2.4
Fail
2.4
Fail
2.8
Fail
2.2
Fail
5.8
AA
2.4
Fail
1.2
Fail
1.1
Fail
6.8
AA
2.8
Fail
1.2
Fail
1.3
Fail
5.3
AA
2.2
Fail
1.1
Fail
1.3
Fail
White BG
8.8AAA
3.6AA Large
1.5Fail
1.3Fail
1.7Fail
Black BG
2.4Fail
5.8AA
13.8AAA
16.2AAA
12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4E3C
A7A659
CACABE
D8D8CF
B3B3BB

Deuteranopia

4E4F3D
B0BB58
C9C7C1
D6D3D1
AFAABD

Tritanopia

514041
E05757
C0C5C7
CBD6D8
9AC2C4

Achromatopsia

4A4A4A
818181
CDCDCD
DDDDDD
C0C0C0

Shades & Tints Shades & Tints

#514A38

Dark
Light

#E7545A

Dark
Light

#BFD9B6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #514a38;
  --color-2: #e7545a;
  --color-3: #bfd9b6;
  --color-4: #c9ebc6;
  --color-5: #97d7b2;
}

SCSS

$color-1: #514a38;
$color-2: #e7545a;
$color-3: #bfd9b6;
$color-4: #c9ebc6;
$color-5: #97d7b2;

TAILWIND

colors: {
  'brand-1': '#514a38',
  'brand-2': '#e7545a',
  'brand-3': '#bfd9b6',
  'brand-4': '#c9ebc6',
  'brand-5': '#97d7b2',
}

RGB Array

[81, 74, 56], [231, 84, 90], [191, 217, 182], [201, 235, 198], [151, 215, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #514A38, #E7545A, #BFD9B6, #C9EBC6, #97D7B2 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: #514a38; --color-2: #e7545a; --color-3: #bfd9b6; --color-4: #c9ebc6; --color-5: #97d7b2. 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