← Back to Editor

#C10E45 · #B07C64 · #EFF8D9 · #4D5A46 · #333B30

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

#C10E45

Dark Violet · Crimson · Camellia

HEX
#C10E45
RGB
rgb(193, 14, 69)
HSL
hsl(342, 86%, 41%)
HSB
hsb(342, 93%, 76%)
CMYK
cmyk(0%, 93%, 64%, 24%)
Oklch
oklch(52.0% 0.202 13.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#B07C64

Tangerine · Gray · Warm Sun

HEX
#B07C64
RGB
rgb(176, 124, 100)
HSL
hsl(19, 32%, 54%)
HSB
hsb(19, 43%, 69%)
CMYK
cmyk(0%, 30%, 43%, 31%)
Oklch
oklch(63.3% 0.074 45.7)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#EFF8D9

Willow Green · Beige · Mint Green

HEX
#EFF8D9
RGB
rgb(239, 248, 217)
HSL
hsl(77, 69%, 91%)
HSB
hsb(77, 13%, 97%)
CMYK
cmyk(4%, 0%, 13%, 3%)
Oklch
oklch(96.4% 0.042 120.4)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#4D5A46

Celadon · DarkOliveGreen · Forest Green

HEX
#4D5A46
RGB
rgb(77, 90, 70)
HSL
hsl(99, 13%, 31%)
HSB
hsb(99, 22%, 35%)
CMYK
cmyk(14%, 0%, 22%, 65%)
Oklch
oklch(45.0% 0.036 134.7)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#333B30

Celadon · DarkSlateGray · Forest Green

HEX
#333B30
RGB
rgb(51, 59, 48)
HSL
hsl(104, 10%, 21%)
HSB
hsb(104, 19%, 23%)
CMYK
cmyk(14%, 0%, 19%, 77%)
Oklch
oklch(34.1% 0.022 137.2)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C10E45
0FC28D

Analogous

C20F9E
C10E45
C2330F

Triadic

C10E45
45C20F
0F45C2

Split-Comp.

C10E45
0FC233
0F9EC2

Tetradic

C10E45
9EC20F
0FC28D
330FC2

Contrast Matrix WCAG 2.1 Contrast

C10E45
B07C64
EFF8D9
4D5A46
333B30
—
1.7
Fail
5.6
AA
1.2
Fail
1.9
Fail
1.7
Fail
—
3.2
AA Large
2.1
Fail
3.3
AA Large
5.6
AA
3.2
AA Large
—
6.7
AA
10.6
AAA
1.2
Fail
2.1
Fail
6.7
AA
—
1.6
Fail
1.9
Fail
3.3
AA Large
10.6
AAA
1.6
Fail
—
White BG
6.1AA
3.6AA Large
1.1Fail
7.3AAA
11.6AAA
Black BG
3.4AA Large
5.9AA
19.1AAA
2.9Fail
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

737238
99996A
F3F3E1
53534B
363733

Deuteranopia

7E8B35
9DA06B
F2F2E2
52514C
363533

Tritanopia

B82D2B
AD6E6F
EFE6E8
4E4F50
333535

Achromatopsia

4A4A4A
898989
F2F2F2
545454
373737

Shades & Tints Shades & Tints

#C10E45

Dark
Light

#B07C64

Dark
Light

#EFF8D9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c10e45;
  --color-2: #b07c64;
  --color-3: #eff8d9;
  --color-4: #4d5a46;
  --color-5: #333b30;
}

SCSS

$color-1: #c10e45;
$color-2: #b07c64;
$color-3: #eff8d9;
$color-4: #4d5a46;
$color-5: #333b30;

TAILWIND

colors: {
  'brand-1': '#c10e45',
  'brand-2': '#b07c64',
  'brand-3': '#eff8d9',
  'brand-4': '#4d5a46',
  'brand-5': '#333b30',
}

RGB Array

[193, 14, 69], [176, 124, 100], [239, 248, 217], [77, 90, 70], [51, 59, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C10E45, #B07C64, #EFF8D9, #4D5A46, #333B30 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: #c10e45; --color-2: #b07c64; --color-3: #eff8d9; --color-4: #4d5a46; --color-5: #333b30. 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