← Back to Editor

#070304 · #2D2733 · #6E3C57 · #D24F3D · #FD9417

sea

A 5-color sea 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

#070304

Crimson · Black · Deep Berry

HEX
#070304
RGB
rgb(7, 3, 4)
HSL
hsl(345, 40%, 2%)
HSB
hsb(345, 57%, 3%)
CMYK
cmyk(0%, 57%, 43%, 97%)
Oklch
oklch(10.8% 0.013 359.8)

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

#2D2733

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2D2733
RGB
rgb(45, 39, 51)
HSL
hsl(270, 13%, 18%)
HSB
hsb(270, 24%, 20%)
CMYK
cmyk(12%, 24%, 0%, 80%)
Oklch
oklch(28.4% 0.023 307.6)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#6E3C57

Rose Purple · DimGray · Camellia

HEX
#6E3C57
RGB
rgb(110, 60, 87)
HSL
hsl(328, 29%, 33%)
HSB
hsb(328, 45%, 43%)
CMYK
cmyk(0%, 45%, 21%, 57%)
Oklch
oklch(42.7% 0.079 347.4)

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

#D24F3D

Vermilion · Chocolate · Passion Red

HEX
#D24F3D
RGB
rgb(210, 79, 61)
HSL
hsl(7, 62%, 53%)
HSB
hsb(7, 71%, 82%)
CMYK
cmyk(0%, 62%, 71%, 18%)
Oklch
oklch(60.1% 0.169 30.5)

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

#FD9417

Ginger · Orange · Warm Sun

HEX
#FD9417
RGB
rgb(253, 148, 23)
HSL
hsl(33, 98%, 54%)
HSB
hsb(33, 91%, 99%)
CMYK
cmyk(0%, 42%, 91%, 1%)
Oklch
oklch(76.2% 0.171 61.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

070304
030706

Analogous

070306
070304
070403

Triadic

070304
040703
030407

Split-Comp.

070304
030704
030607

Tetradic

070304
060703
030706
040307

Contrast Matrix WCAG 2.1 Contrast

070304
2D2733
6E3C57
D24F3D
FD9417
—
1.4
Fail
2.4
Fail
4.8
AA
9.2
AAA
1.4
Fail
—
1.7
Fail
3.4
AA Large
6.5
AA
2.4
Fail
1.7
Fail
—
2.0
Fail
3.9
AA Large
4.8
AA
3.4
AA Large
2.0
Fail
—
1.9
Fail
9.2
AAA
6.5
AA
3.9
AA Large
1.9
Fail
—
White BG
20.5AAA
14.5AAA
8.6AAA
4.3AA Large
2.2Fail
Black BG
1.0Fail
1.4Fail
2.4Fail
4.9AA
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

050504
2A2A30
585850
999841
D0CF35

Deuteranopia

060604
2B2B2F
5B5F4F
A1AB42
D6DE3D

Tritanopia

070404
2D2E2D
6C4B4A
CB4546
F84D52

Achromatopsia

040404
2A2A2A
4E4E4E
747474
A5A5A5

Shades & Tints Shades & Tints

#070304

Dark
Light

#2D2733

Dark
Light

#6E3C57

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #070304;
  --color-2: #2d2733;
  --color-3: #6e3c57;
  --color-4: #d24f3d;
  --color-5: #fd9417;
}

SCSS

$color-1: #070304;
$color-2: #2d2733;
$color-3: #6e3c57;
$color-4: #d24f3d;
$color-5: #fd9417;

TAILWIND

colors: {
  'brand-1': '#070304',
  'brand-2': '#2d2733',
  'brand-3': '#6e3c57',
  'brand-4': '#d24f3d',
  'brand-5': '#fd9417',
}

RGB Array

[7, 3, 4], [45, 39, 51], [110, 60, 87], [210, 79, 61], [253, 148, 23]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #070304, #2D2733, #6E3C57, #D24F3D, #FD9417 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: #070304; --color-2: #2d2733; --color-3: #6e3c57; --color-4: #d24f3d; --color-5: #fd9417. 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 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