← Back to Editor

#2C080A · #B22456 · #B48398 · #93C5B9 · #B0E5DF

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

#2C080A

Vermilion · Black · Deep Berry

HEX
#2C080A
RGB
rgb(44, 8, 10)
HSL
hsl(357, 69%, 10%)
HSB
hsb(357, 82%, 17%)
CMYK
cmyk(0%, 82%, 77%, 83%)
Oklch
oklch(20.1% 0.059 21.0)

TraditionalVermilion」· PaintDeep Berry」· Creative Blush Sunrise

#B22456

Dark Violet · Brown · Camellia

HEX
#B22456
RGB
rgb(178, 36, 86)
HSL
hsl(339, 66%, 42%)
HSB
hsb(339, 80%, 70%)
CMYK
cmyk(0%, 80%, 52%, 30%)
Oklch
oklch(50.8% 0.179 5.9)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

#B48398

Rouge · DarkGray · Rose Pink

HEX
#B48398
RGB
rgb(180, 131, 152)
HSL
hsl(334, 25%, 61%)
HSB
hsb(334, 27%, 71%)
CMYK
cmyk(0%, 27%, 16%, 29%)
Oklch
oklch(66.4% 0.066 351.6)

TraditionalRouge」· PaintRose Pink」· Creative Rose Petal

#93C5B9

Jade · DarkGray · Lake Green

HEX
#93C5B9
RGB
rgb(147, 197, 185)
HSL
hsl(166, 30%, 67%)
HSB
hsb(166, 25%, 77%)
CMYK
cmyk(25%, 0%, 6%, 23%)
Oklch
oklch(78.5% 0.055 178.3)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#B0E5DF

Jade · LightBlue · Glacier Blue

HEX
#B0E5DF
RGB
rgb(176, 229, 223)
HSL
hsl(173, 50%, 79%)
HSB
hsb(173, 23%, 90%)
CMYK
cmyk(23%, 0%, 3%, 10%)
Oklch
oklch(88.4% 0.055 187.6)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2C080A
082B29

Analogous

2B081B
2C080A
2B1808

Triadic

2C080A
0A2B08
080A2B

Split-Comp.

2C080A
082B18
081B2B

Tetradic

2C080A
1B2B08
082B29
18082B

Contrast Matrix WCAG 2.1 Contrast

2C080A
B22456
B48398
93C5B9
B0E5DF
2.9
Fail
5.8
AA
9.5
AAA
13.2
AAA
2.9
Fail
2.0
Fail
3.3
AA Large
4.6
AA
5.8
AA
2.0
Fail
1.6
Fail
2.3
Fail
9.5
AAA
3.3
AA Large
1.6
Fail
1.4
Fail
13.2
AAA
4.6
AA
2.3
Fail
1.4
Fail
White BG
18.3AAA
6.4AA
3.2AA Large
1.9Fail
1.4Fail
Black BG
1.1Fail
3.3AA Large
6.6AA
10.9AAA
15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1C1C0A
75734A
9F9E93
A9A9BC
C7C7E0

Deuteranopia

1F2109
7D8747
A2A592
A6A2BD
C4C0E1

Tritanopia

2A0909
AB403E
B28F8E
96BEBF
B3E2E2

Achromatopsia

131313
545454
949494
B5B5B5
D4D4D4

Shades & Tints Shades & Tints

#2C080A

Dark
Light

#B22456

Dark
Light

#B48398

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2c080a;
  --color-2: #b22456;
  --color-3: #b48398;
  --color-4: #93c5b9;
  --color-5: #b0e5df;
}

SCSS

$color-1: #2c080a;
$color-2: #b22456;
$color-3: #b48398;
$color-4: #93c5b9;
$color-5: #b0e5df;

TAILWIND

colors: {
  'brand-1': '#2c080a',
  'brand-2': '#b22456',
  'brand-3': '#b48398',
  'brand-4': '#93c5b9',
  'brand-5': '#b0e5df',
}

RGB Array

[44, 8, 10], [178, 36, 86], [180, 131, 152], [147, 197, 185], [176, 229, 223]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2C080A, #B22456, #B48398, #93C5B9, #B0E5DF 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: #2c080a; --color-2: #b22456; --color-3: #b48398; --color-4: #93c5b9; --color-5: #b0e5df. 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