← Back to Editor

#281E28 · #6F4470 · #33B0AE · #8FE3D1 · #E1E3C3

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#281E28

Rose Purple · DarkSlateGray · Dark Purple

HEX
#281E28
RGB
rgb(40, 30, 40)
HSL
hsl(300, 14%, 14%)
HSB
hsb(300, 25%, 16%)
CMYK
cmyk(0%, 25%, 0%, 84%)
Oklch
oklch(25.1% 0.024 326.3)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#6F4470

Dark Plum · DimGray · Eggplant

HEX
#6F4470
RGB
rgb(111, 68, 112)
HSL
hsl(299, 24%, 35%)
HSB
hsb(299, 39%, 44%)
CMYK
cmyk(1%, 39%, 0%, 56%)
Oklch
oklch(45.3% 0.087 326.1)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#33B0AE

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#33B0AE
RGB
rgb(51, 176, 174)
HSL
hsl(179, 55%, 45%)
HSB
hsb(179, 71%, 69%)
CMYK
cmyk(71%, 0%, 1%, 31%)
Oklch
oklch(69.1% 0.106 193.4)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8FE3D1

Jade · SkyBlue · Lake Green

HEX
#8FE3D1
RGB
rgb(143, 227, 209)
HSL
hsl(167, 60%, 73%)
HSB
hsb(167, 37%, 89%)
CMYK
cmyk(37%, 0%, 8%, 11%)
Oklch
oklch(85.7% 0.086 179.0)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#E1E3C3

Fresh Green · Wheat · Lemon Cream

HEX
#E1E3C3
RGB
rgb(225, 227, 195)
HSL
hsl(64, 36%, 83%)
HSB
hsb(64, 14%, 89%)
CMYK
cmyk(1%, 0%, 14%, 11%)
Oklch
oklch(90.6% 0.042 110.1)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

281E28
1F291F

Analogous

241F29
281E28
291F24

Triadic

281E28
29291F
1F2929

Split-Comp.

281E28
24291F
1F2924

Tetradic

281E28
29241F
1F291F
1F2429

Contrast Matrix WCAG 2.1 Contrast

281E28
6F4470
33B0AE
8FE3D1
E1E3C3
—
2.1
Fail
6.1
AA
10.8
AAA
12.2
AAA
2.1
Fail
—
2.9
Fail
5.1
AA
5.8
AA
6.1
AA
2.9
Fail
—
1.8
Fail
2.0
Fail
10.8
AAA
5.1
AA
1.8
Fail
—
1.1
Fail
12.2
AAA
5.8
AA
2.0
Fail
1.1
Fail
—
White BG
16.1AAA
7.7AAA
2.6Fail
1.5Fail
1.3Fail
Black BG
1.3Fail
2.7Fail
8.0AAA
14.1AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

242426
5C5C65
696AAE
B3B4D5
E2E2CB

Deuteranopia

242525
5F6263
6259AF
AFA8D6
E2E2CD

Tritanopia

282423
6D5D5B
39AFAF
93D9DA
E1D1D2

Achromatopsia

222222
565656
8A8A8A
C8C8C8
DFDFDF

Shades & Tints Shades & Tints

#281E28

Dark
Light

#6F4470

Dark
Light

#33B0AE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #281e28;
  --color-2: #6f4470;
  --color-3: #33b0ae;
  --color-4: #8fe3d1;
  --color-5: #e1e3c3;
}

SCSS

$color-1: #281e28;
$color-2: #6f4470;
$color-3: #33b0ae;
$color-4: #8fe3d1;
$color-5: #e1e3c3;

TAILWIND

colors: {
  'brand-1': '#281e28',
  'brand-2': '#6f4470',
  'brand-3': '#33b0ae',
  'brand-4': '#8fe3d1',
  'brand-5': '#e1e3c3',
}

RGB Array

[40, 30, 40], [111, 68, 112], [51, 176, 174], [143, 227, 209], [225, 227, 195]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #281E28, #6F4470, #33B0AE, #8FE3D1, #E1E3C3 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: #281e28; --color-2: #6f4470; --color-3: #33b0ae; --color-4: #8fe3d1; --color-5: #e1e3c3. 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 cool-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