← Back to Editor

#514633 · #888D74 · #E68580 · #F13C44 · #BB2D30

A 5-color palette 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

#514633

Ochre · DarkOliveGreen · Amber Brown

HEX
#514633
RGB
rgb(81, 70, 51)
HSL
hsl(38, 23%, 26%)
HSB
hsb(38, 37%, 32%)
CMYK
cmyk(0%, 14%, 37%, 68%)
Oklch
oklch(40.0% 0.034 81.1)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#888D74

Grass Green · Gray · Olive Green

HEX
#888D74
RGB
rgb(136, 141, 116)
HSL
hsl(72, 10%, 50%)
HSB
hsb(72, 18%, 55%)
CMYK
cmyk(4%, 0%, 18%, 45%)
Oklch
oklch(63.2% 0.037 116.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#E68580

Peach Pink · LightCoral · Coral Red

HEX
#E68580
RGB
rgb(230, 133, 128)
HSL
hsl(3, 67%, 70%)
HSB
hsb(3, 44%, 90%)
CMYK
cmyk(0%, 42%, 44%, 10%)
Oklch
oklch(72.0% 0.120 23.6)

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

#F13C44

Vermilion · Tomato · Passion Red

HEX
#F13C44
RGB
rgb(241, 60, 68)
HSL
hsl(357, 87%, 59%)
HSB
hsb(357, 75%, 95%)
CMYK
cmyk(0%, 75%, 72%, 5%)
Oklch
oklch(63.3% 0.216 23.9)

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

#BB2D30

Vermilion · FireBrick · Passion Red

HEX
#BB2D30
RGB
rgb(187, 45, 48)
HSL
hsl(359, 61%, 45%)
HSB
hsb(359, 76%, 73%)
CMYK
cmyk(0%, 76%, 74%, 27%)
Oklch
oklch(52.4% 0.179 25.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

514633
333E52

Analogous

523733
514633
4D5233

Triadic

514633
335246
463352

Split-Comp.

514633
334D52
373352

Tetradic

514633
335237
333E52
52334D

Contrast Matrix WCAG 2.1 Contrast

514633
888D74
E68580
F13C44
BB2D30
—
2.7
Fail
3.5
AA Large
2.4
Fail
1.6
Fail
2.7
Fail
—
1.3
Fail
1.1
Fail
1.7
Fail
3.5
AA Large
1.3
Fail
—
1.5
Fail
2.3
Fail
2.4
Fail
1.1
Fail
1.5
Fail
—
1.5
Fail
1.6
Fail
1.7
Fail
2.3
Fail
1.5
Fail
—
White BG
9.2AAA
3.4AA Large
2.6Fail
3.8AA Large
5.9AA
Black BG
2.3Fail
6.1AA
8.0AAA
5.5AA
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4C38
8A8A7A
BCBB81
A3A142
7E7C2F

Deuteranopia

4D4E39
8A8A7B
C2C982
ADBB42
86902F

Tritanopia

503B3C
887F80
E18282
E84140
B42F2F

Achromatopsia

474747
898989
A1A1A1
737373
585858

Shades & Tints Shades & Tints

#514633

Dark
Light

#888D74

Dark
Light

#E68580

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #514633;
  --color-2: #888d74;
  --color-3: #e68580;
  --color-4: #f13c44;
  --color-5: #bb2d30;
}

SCSS

$color-1: #514633;
$color-2: #888d74;
$color-3: #e68580;
$color-4: #f13c44;
$color-5: #bb2d30;

TAILWIND

colors: {
  'brand-1': '#514633',
  'brand-2': '#888d74',
  'brand-3': '#e68580',
  'brand-4': '#f13c44',
  'brand-5': '#bb2d30',
}

RGB Array

[81, 70, 51], [136, 141, 116], [230, 133, 128], [241, 60, 68], [187, 45, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #514633, #888D74, #E68580, #F13C44, #BB2D30 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: #514633; --color-2: #888d74; --color-3: #e68580; --color-4: #f13c44; --color-5: #bb2d30. 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 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