← Back to Editor

#D24598 · #976168 · #52581C · #072C0F · #3D9B8C

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

#D24598

Rose Purple · MediumVioletRed · Rose Pink

HEX
#D24598
RGB
rgb(210, 69, 152)
HSL
hsl(325, 61%, 55%)
HSB
hsb(325, 67%, 82%)
CMYK
cmyk(0%, 67%, 28%, 18%)
Oklch
oklch(61.3% 0.195 348.1)

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

#976168

Crimson · Gray · Passion Red

HEX
#976168
RGB
rgb(151, 97, 104)
HSL
hsl(352, 22%, 49%)
HSB
hsb(352, 36%, 59%)
CMYK
cmyk(0%, 36%, 31%, 41%)
Oklch
oklch(55.3% 0.071 11.2)

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

#52581C

Autumn Sage · DarkOliveGreen · Amber Gold

HEX
#52581C
RGB
rgb(82, 88, 28)
HSL
hsl(66, 52%, 23%)
HSB
hsb(66, 68%, 35%)
CMYK
cmyk(7%, 0%, 68%, 65%)
Oklch
oklch(44.2% 0.082 114.7)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

#072C0F

Pine Green · Black · Dark Green

HEX
#072C0F
RGB
rgb(7, 44, 15)
HSL
hsl(133, 73%, 10%)
HSB
hsb(133, 84%, 17%)
CMYK
cmyk(84%, 0%, 66%, 83%)
Oklch
oklch(25.9% 0.067 147.3)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

#3D9B8C

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#3D9B8C
RGB
rgb(61, 155, 140)
HSL
hsl(170, 44%, 42%)
HSB
hsb(170, 61%, 61%)
CMYK
cmyk(61%, 0%, 10%, 39%)
Oklch
oklch(62.9% 0.091 181.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D24598
46D281

Analogous

C746D2
D24598
D24652

Triadic

D24598
98D246
4698D2

Split-Comp.

D24598
52D246
46D2C7

Tetradic

D24598
D2C746
46D281
4652D2

Contrast Matrix WCAG 2.1 Contrast

D24598
976168
52581C
072C0F
3D9B8C
—
1.2
Fail
1.8
Fail
3.7
AA Large
1.2
Fail
1.2
Fail
—
1.5
Fail
3.1
AA Large
1.5
Fail
1.8
Fail
1.5
Fail
—
2.0
Fail
2.3
Fail
3.7
AA Large
3.1
AA Large
2.0
Fail
—
4.6
AA
1.2
Fail
1.5
Fail
2.3
Fail
4.6
AA
—
White BG
4.2AA Large
5.0AA
7.6AAA
15.3AAA
3.4AA Large
Black BG
5.0AA
4.2AA Large
2.8Fail
1.4Fail
6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

959484
807F66
55552B
171716
666790

Deuteranopia

9DA87F
838766
54542E
151218
605991

Tritanopia

CB7471
946565
523639
091C1D
429293

Achromatopsia

797979
727272
4F4F4F
1E1E1E
7D7D7D

Shades & Tints Shades & Tints

#D24598

Dark
Light

#976168

Dark
Light

#52581C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d24598;
  --color-2: #976168;
  --color-3: #52581c;
  --color-4: #072c0f;
  --color-5: #3d9b8c;
}

SCSS

$color-1: #d24598;
$color-2: #976168;
$color-3: #52581c;
$color-4: #072c0f;
$color-5: #3d9b8c;

TAILWIND

colors: {
  'brand-1': '#d24598',
  'brand-2': '#976168',
  'brand-3': '#52581c',
  'brand-4': '#072c0f',
  'brand-5': '#3d9b8c',
}

RGB Array

[210, 69, 152], [151, 97, 104], [82, 88, 28], [7, 44, 15], [61, 155, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D24598, #976168, #52581C, #072C0F, #3D9B8C is ideal for: tech websites, dark mode UIs, game UIs, 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: #d24598; --color-2: #976168; --color-3: #52581c; --color-4: #072c0f; --color-5: #3d9b8c. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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