← Back to Editor

#9DD72B · #C4875A · #B46636 · #D0101B · #1A1915

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

#9DD72B

Grass Green · GreenYellow · Olive Green

HEX
#9DD72B
RGB
rgb(157, 215, 43)
HSL
hsl(80, 68%, 51%)
HSB
hsb(80, 80%, 84%)
CMYK
cmyk(27%, 0%, 80%, 16%)
Oklch
oklch(81.0% 0.197 127.5)

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

#C4875A

Tangerine · DarkSalmon · Warm Sun

HEX
#C4875A
RGB
rgb(196, 135, 90)
HSL
hsl(25, 47%, 56%)
HSB
hsb(25, 54%, 77%)
CMYK
cmyk(0%, 31%, 54%, 23%)
Oklch
oklch(67.5% 0.096 56.7)

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

#B46636

Tangerine · Sienna · Amber Brown

HEX
#B46636
RGB
rgb(180, 102, 54)
HSL
hsl(23, 54%, 46%)
HSB
hsb(23, 70%, 71%)
CMYK
cmyk(0%, 43%, 70%, 29%)
Oklch
oklch(59.0% 0.118 50.3)

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

#D0101B

Vermilion · Crimson · Passion Red

HEX
#D0101B
RGB
rgb(208, 16, 27)
HSL
hsl(357, 86%, 44%)
HSB
hsb(357, 92%, 82%)
CMYK
cmyk(0%, 92%, 87%, 18%)
Oklch
oklch(54.4% 0.216 27.0)

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

#1A1915

Ochre · Black · Amber Gold

HEX
#1A1915
RGB
rgb(26, 25, 21)
HSL
hsl(48, 11%, 9%)
HSB
hsb(48, 19%, 10%)
CMYK
cmyk(0%, 4%, 19%, 90%)
Oklch
oklch(21.3% 0.008 95.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9DD72B
662DD7

Analogous

D7BB2D
9DD72B
49D72D

Triadic

9DD72B
2D9ED7
D72D9E

Split-Comp.

9DD72B
2D49D7
BB2DD7

Tetradic

9DD72B
2DD7BB
662DD7
D72D49

Contrast Matrix WCAG 2.1 Contrast

9DD72B
C4875A
B46636
D0101B
1A1915
—
1.8
Fail
2.5
Fail
3.2
AA Large
10.2
AAA
1.8
Fail
—
1.4
Fail
1.8
Fail
5.8
AA
2.5
Fail
1.4
Fail
—
1.3
Fail
4.1
AA Large
3.2
AA Large
1.8
Fail
1.3
Fail
—
3.2
AA Large
10.2
AAA
5.8
AA
4.1
AA Large
3.2
AA Large
—
White BG
1.7Fail
3.0AA Large
4.3AA Large
5.6AA
17.6AAA
Black BG
12.2AAA
7.0AA
4.9AA
3.8AA Large
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B755
AAA965
929242
7D7B18
1A1A16

Deuteranopia

B3AE5F
ADB268
979D44
889618
1A1A16

Tritanopia

A0757D
C16D6F
B04B4D
C61616
1A1717

Achromatopsia

B2B2B2
949494
787878
4B4B4B
191919

Shades & Tints Shades & Tints

#9DD72B

Dark
Light

#C4875A

Dark
Light

#B46636

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9dd72b;
  --color-2: #c4875a;
  --color-3: #b46636;
  --color-4: #d0101b;
  --color-5: #1a1915;
}

SCSS

$color-1: #9dd72b;
$color-2: #c4875a;
$color-3: #b46636;
$color-4: #d0101b;
$color-5: #1a1915;

TAILWIND

colors: {
  'brand-1': '#9dd72b',
  'brand-2': '#c4875a',
  'brand-3': '#b46636',
  'brand-4': '#d0101b',
  'brand-5': '#1a1915',
}

RGB Array

[157, 215, 43], [196, 135, 90], [180, 102, 54], [208, 16, 27], [26, 25, 21]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9DD72B, #C4875A, #B46636, #D0101B, #1A1915 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: #9dd72b; --color-2: #c4875a; --color-3: #b46636; --color-4: #d0101b; --color-5: #1a1915. 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