← Back to Editor

#45515D · #4DC7BE · #C3F061 · #F07171 · #2F1A1C

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

#45515D

Indigo · DarkSlateGray · Prussian Blue

HEX
#45515D
RGB
rgb(69, 81, 93)
HSL
hsl(210, 15%, 32%)
HSB
hsb(210, 26%, 36%)
CMYK
cmyk(26%, 13%, 0%, 64%)
Oklch
oklch(42.9% 0.025 248.4)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#4DC7BE

Mineral Blue · MediumTurquoise · Lake Green

HEX
#4DC7BE
RGB
rgb(77, 199, 190)
HSL
hsl(176, 52%, 54%)
HSB
hsb(176, 61%, 78%)
CMYK
cmyk(61%, 0%, 5%, 22%)
Oklch
oklch(76.0% 0.108 188.3)

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

#C3F061

Willow Green · GreenYellow · Apple Green

HEX
#C3F061
RGB
rgb(195, 240, 97)
HSL
hsl(79, 83%, 66%)
HSB
hsb(79, 60%, 94%)
CMYK
cmyk(19%, 0%, 60%, 6%)
Oklch
oklch(89.6% 0.176 124.6)

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

#F07171

Peach Pink · Salmon · Coral Red

HEX
#F07171
RGB
rgb(240, 113, 113)
HSL
hsl(0, 81%, 69%)
HSB
hsb(0, 53%, 94%)
CMYK
cmyk(0%, 53%, 53%, 6%)
Oklch
oklch(69.9% 0.157 22.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#2F1A1C

Crimson · Black · Deep Berry

HEX
#2F1A1C
RGB
rgb(47, 26, 28)
HSL
hsl(354, 29%, 14%)
HSB
hsb(354, 45%, 18%)
CMYK
cmyk(0%, 45%, 40%, 82%)
Oklch
oklch(24.7% 0.034 13.6)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

45515D
5E5245

Analogous

455E5E
45515D
45455E

Triadic

45515D
5E4552
525E45

Split-Comp.

45515D
5E4545
5E5E45

Tetradic

45515D
5E455E
5E5245
455E45

Contrast Matrix WCAG 2.1 Contrast

45515D
4DC7BE
C3F061
F07171
2F1A1C
—
4.0
AA Large
6.2
AA
2.8
Fail
2.0
Fail
4.0
AA Large
—
1.6
Fail
1.4
Fail
8.0
AAA
6.2
AA
1.6
Fail
—
2.2
Fail
12.4
AAA
2.8
Fail
1.4
Fail
2.2
Fail
—
5.7
AA
2.0
Fail
8.0
AAA
12.4
AAA
5.7
AA
—
White BG
8.1AAA
2.1Fail
1.3Fail
2.9Fail
16.3AAA
Black BG
2.6Fail
10.2AAA
16.0AAA
7.3AAA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4A4A5A
8283C0
D6D784
B9B871
26261C

Deuteranopia

4A4959
7B72C1
D4D18C
C0CA71
27291B

Tritanopia

465857
53C2C2
C59FA5
EA7171
2E1B1B

Achromatopsia

4F4F4F
A1A1A1
D2D2D2
979797
212121

Shades & Tints Shades & Tints

#45515D

Dark
Light

#4DC7BE

Dark
Light

#C3F061

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #45515d;
  --color-2: #4dc7be;
  --color-3: #c3f061;
  --color-4: #f07171;
  --color-5: #2f1a1c;
}

SCSS

$color-1: #45515d;
$color-2: #4dc7be;
$color-3: #c3f061;
$color-4: #f07171;
$color-5: #2f1a1c;

TAILWIND

colors: {
  'brand-1': '#45515d',
  'brand-2': '#4dc7be',
  'brand-3': '#c3f061',
  'brand-4': '#f07171',
  'brand-5': '#2f1a1c',
}

RGB Array

[69, 81, 93], [77, 199, 190], [195, 240, 97], [240, 113, 113], [47, 26, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #45515D, #4DC7BE, #C3F061, #F07171, #2F1A1C 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: #45515d; --color-2: #4dc7be; --color-3: #c3f061; --color-4: #f07171; --color-5: #2f1a1c. 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