← Back to Editor

#76B299 · #332E2E · #F23649 · #FE9C48 · #E3CBA7

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

#76B299

Mineral Blue · DarkSeaGreen · Olive Green

HEX
#76B299
RGB
rgb(118, 178, 153)
HSL
hsl(155, 28%, 58%)
HSB
hsb(155, 34%, 70%)
CMYK
cmyk(34%, 0%, 14%, 30%)
Oklch
oklch(71.5% 0.073 166.4)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#332E2E

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#332E2E
RGB
rgb(51, 46, 46)
HSL
hsl(0, 5%, 19%)
HSB
hsb(0, 10%, 20%)
CMYK
cmyk(0%, 10%, 10%, 80%)
Oklch
oklch(30.6% 0.007 17.6)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#F23649

Vermilion · Crimson · Passion Red

HEX
#F23649
RGB
rgb(242, 54, 73)
HSL
hsl(354, 88%, 58%)
HSB
hsb(354, 78%, 95%)
CMYK
cmyk(0%, 78%, 70%, 5%)
Oklch
oklch(63.1% 0.221 21.5)

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

#FE9C48

Apricot · SandyBrown · Warm Sun

HEX
#FE9C48
RGB
rgb(254, 156, 72)
HSL
hsl(28, 99%, 64%)
HSB
hsb(28, 72%, 100%)
CMYK
cmyk(0%, 39%, 72%, 0%)
Oklch
oklch(77.9% 0.152 58.1)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E3CBA7

Goose Yellow · Wheat · Peach Orange

HEX
#E3CBA7
RGB
rgb(227, 203, 167)
HSL
hsl(36, 52%, 77%)
HSB
hsb(36, 26%, 89%)
CMYK
cmyk(0%, 11%, 26%, 11%)
Oklch
oklch(85.3% 0.055 77.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

76B299
B2768F

Analogous

76B27B
76B299
76ADB2

Triadic

76B299
9976B2
B29976

Split-Comp.

76B299
B276AD
B27B76

Tetradic

76B299
7B76B2
B2768F
ADB276

Contrast Matrix WCAG 2.1 Contrast

76B299
332E2E
F23649
FE9C48
E3CBA7
—
5.5
AA
1.6
Fail
1.2
Fail
1.6
Fail
5.5
AA
—
3.4
AA Large
6.4
AA
8.5
AAA
1.6
Fail
3.4
AA Large
—
1.9
Fail
2.5
Fail
1.2
Fail
6.4
AA
1.9
Fail
—
1.3
Fail
1.6
Fail
8.5
AAA
2.5
Fail
1.3
Fail
—
White BG
2.4Fail
13.4AAA
3.9AA Large
2.1Fail
1.6Fail
Black BG
8.6AAA
1.6Fail
5.4AA
10.1AAA
13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

90919F
31312E
A19F44
D4D35C
D9D8B0

Deuteranopia

8D88A1
31312E
ACBA43
D9E161
DADCB2

Tritanopia

79A4A5
332E2E
E94140
F96C70
E2B7B8

Achromatopsia

9D9D9D
2F2F2F
707070
B0B0B0
CECECE

Shades & Tints Shades & Tints

#76B299

Dark
Light

#332E2E

Dark
Light

#F23649

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #76b299;
  --color-2: #332e2e;
  --color-3: #f23649;
  --color-4: #fe9c48;
  --color-5: #e3cba7;
}

SCSS

$color-1: #76b299;
$color-2: #332e2e;
$color-3: #f23649;
$color-4: #fe9c48;
$color-5: #e3cba7;

TAILWIND

colors: {
  'brand-1': '#76b299',
  'brand-2': '#332e2e',
  'brand-3': '#f23649',
  'brand-4': '#fe9c48',
  'brand-5': '#e3cba7',
}

RGB Array

[118, 178, 153], [51, 46, 46], [242, 54, 73], [254, 156, 72], [227, 203, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #76B299, #332E2E, #F23649, #FE9C48, #E3CBA7 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: #76b299; --color-2: #332e2e; --color-3: #f23649; --color-4: #fe9c48; --color-5: #e3cba7. 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