#D40F67 + #8F2B5E + #4C4C59 + #996F1A + #C0B717 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D40F67

Dark Violet · MediumVioletRed · Camellia

HEX

#D40F67

RGB

rgb(212, 15, 103)

HSL

hsl(333, 87%, 45%)

HSB

hsb(333, 93%, 83%)

CMYK

cmyk(0%, 93%, 51%, 17%)

Oklch

oklch(56.4% 0.222 3.8)

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

#8F2B5E

Rose Purple · Brown · Camellia

HEX

#8F2B5E

RGB

rgb(143, 43, 94)

HSL

hsl(329, 54%, 36%)

HSB

hsb(329, 70%, 56%)

CMYK

cmyk(0%, 70%, 34%, 44%)

Oklch

oklch(45.6% 0.144 352.9)

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

#4C4C59

Deep Indigo · DarkSlateGray · Charcoal

HEX

#4C4C59

RGB

rgb(76, 76, 89)

HSL

hsl(240, 8%, 32%)

HSB

hsb(240, 15%, 35%)

CMYK

cmyk(15%, 15%, 0%, 65%)

Oklch

oklch(42.1% 0.021 285.4)

Traditional「Deep Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#996F1A

Ochre · Sienna · Honey Gold

HEX

#996F1A

RGB

rgb(153, 111, 26)

HSL

hsl(40, 71%, 35%)

HSB

hsb(40, 83%, 60%)

CMYK

cmyk(0%, 27%, 83%, 40%)

Oklch

oklch(57.0% 0.109 79.8)

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

#C0B717

Autumn Sage · GoldenRod · Honey Gold

HEX

#C0B717

RGB

rgb(192, 183, 23)

HSL

hsl(57, 79%, 42%)

HSB

hsb(57, 88%, 75%)

CMYK

cmyk(0%, 5%, 88%, 25%)

Oklch

oklch(76.3% 0.158 105.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D40F67

0FD77D

Analogous

D70FCD

D40F67

D7190F

Triadic

D40F67

69D70F

0F69D7

Split-Comp.

D40F67

0FD719

0FCDD7

Tetradic

D40F67

CDD70F

0FD77D

190FD7

Contrast Matrix WCAG 2.1 Contrast

D40F67	8F2B5E	4C4C59	996F1A	C0B717
—	1.5 Fail	1.6 Fail	1.1 Fail	2.5 Fail
1.5 Fail	—	1.1 Fail	1.7 Fail	3.7 AA Large
1.6 Fail	1.1 Fail	—	1.9 Fail	4.0 AA Large
1.1 Fail	1.7 Fail	1.9 Fail	—	2.2 Fail
2.5 Fail	3.7 AA Large	4.0 AA Large	2.2 Fail	—

White BG

5.2AA

7.9AAA

8.4AAA

4.5AA

2.1Fail

Black BG

4.1AA Large

2.7Fail

2.5Fail

4.6AA

10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F7D52

646352

4C4C56

87862F

BCBC3E

Deuteranopia

8A994D

6A714F

4C4C55

898C34

BDBD47

Tritanopia

CA413D

8A4846

4C5353

973F42

C05C63

Achromatopsia

545454

4F4F4F

4D4D4D

727272

A7A7A7

Shades & Tints Shades & Tints

#D40F67

Dark

Light

#8F2B5E

Dark

Light

#4C4C59

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d40f67;
  --color-2: #8f2b5e;
  --color-3: #4c4c59;
  --color-4: #996f1a;
  --color-5: #c0b717;
}

SCSS

$color-1: #d40f67;
$color-2: #8f2b5e;
$color-3: #4c4c59;
$color-4: #996f1a;
$color-5: #c0b717;

TAILWIND

colors: {
  'brand-1': '#d40f67',
  'brand-2': '#8f2b5e',
  'brand-3': '#4c4c59',
  'brand-4': '#996f1a',
  'brand-5': '#c0b717',
}

RGB Array

[212, 15, 103], [143, 43, 94], [76, 76, 89], [153, 111, 26], [192, 183, 23]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #D40F67, #8F2B5E, #4C4C59, #996F1A, #C0B717 is ideal for: tech websites, dark mode UIs, game UIs. 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: #d40f67; --color-2: #8f2b5e; --color-3: #4c4c59; --color-4: #996f1a; --color-5: #c0b717. 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. 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 sea-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