#2F2526 + #422F80 + #474397 + #4F62B1 + #B6BD39 · 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

#2F2526

Crimson · DarkSlateGray · Deep Berry

HEX

#2F2526

RGB

rgb(47, 37, 38)

HSL

hsl(354, 12%, 16%)

HSB

hsb(354, 21%, 18%)

CMYK

cmyk(0%, 21%, 19%, 82%)

Oklch

oklch(27.6% 0.015 11.3)

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

#422F80

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#422F80

RGB

rgb(66, 47, 128)

HSL

hsl(254, 46%, 34%)

HSB

hsb(254, 63%, 50%)

CMYK

cmyk(48%, 63%, 0%, 50%)

Oklch

oklch(37.5% 0.130 289.4)

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

#474397

Deep Indigo · DarkSlateBlue · Navy Blue

HEX

#474397

RGB

rgb(71, 67, 151)

HSL

hsl(243, 39%, 43%)

HSB

hsb(243, 56%, 59%)

CMYK

cmyk(53%, 56%, 0%, 41%)

Oklch

oklch(43.4% 0.133 281.4)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#4F62B1

Indigo · SteelBlue · Navy Blue

HEX

#4F62B1

RGB

rgb(79, 98, 177)

HSL

hsl(228, 39%, 50%)

HSB

hsb(228, 55%, 69%)

CMYK

cmyk(55%, 45%, 0%, 31%)

Oklch

oklch(52.0% 0.126 271.2)

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

#B6BD39

Autumn Sage · GoldenRod · Honey Gold

HEX

#B6BD39

RGB

rgb(182, 189, 57)

HSL

hsl(63, 54%, 48%)

HSB

hsb(63, 70%, 74%)

CMYK

cmyk(4%, 0%, 70%, 26%)

Oklch

oklch(76.9% 0.150 112.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2F2526

242E2D

Analogous

2E242A

2F2526

2E2824

Triadic

2F2526

252E24

24252E

Split-Comp.

2F2526

242E28

242A2E

Tetradic

2F2526

2A2E24

242E2D

28242E

Contrast Matrix WCAG 2.1 Contrast

2F2526	422F80	474397	4F62B1	B6BD39
—	1.4 Fail	1.8 Fail	2.6 Fail	7.3 AAA
1.4 Fail	—	1.3 Fail	1.9 Fail	5.3 AA
1.8 Fail	1.3 Fail	—	1.5 Fail	4.1 AA Large
2.6 Fail	1.9 Fail	1.5 Fail	—	2.8 Fail
7.3 AAA	5.3 AA	4.1 AA Large	2.8 Fail	—

White BG

14.9AAA

10.8AAA

8.3AAA

5.7AA

2.0Fail

Black BG

1.4Fail

1.9Fail

2.5Fail

3.7AA Large

10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B26

3A3A6C

454583

57579E

B9B959

Deuteranopia

2B2C26

3B3C68

46467E

565599

B9B861

Tritanopia

2F2626

415D5A

47736F

508F8B

B67278

Achromatopsia

282828

3E3E3E

4E4E4E

656565

ACACAC

Shades & Tints Shades & Tints

#2F2526

Dark

Light

#422F80

Dark

Light

#474397

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2f2526;
  --color-2: #422f80;
  --color-3: #474397;
  --color-4: #4f62b1;
  --color-5: #b6bd39;
}

SCSS

$color-1: #2f2526;
$color-2: #422f80;
$color-3: #474397;
$color-4: #4f62b1;
$color-5: #b6bd39;

TAILWIND

colors: {
  'brand-1': '#2f2526',
  'brand-2': '#422f80',
  'brand-3': '#474397',
  'brand-4': '#4f62b1',
  'brand-5': '#b6bd39',
}

RGB Array

[47, 37, 38], [66, 47, 128], [71, 67, 151], [79, 98, 177], [182, 189, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #2F2526, #422F80, #474397, #4F62B1, #B6BD39 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: #2f2526; --color-2: #422f80; --color-3: #474397; --color-4: #4f62b1; --color-5: #b6bd39. 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