← Back to Editor

#42411F · #ABA307 · #BAB99E · #191A17 · #217A71

sea

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

#42411F

Autumn Sage · DarkOliveGreen · Amber Gold

HEX
#42411F
RGB
rgb(66, 65, 31)
HSL
hsl(58, 36%, 19%)
HSB
hsb(58, 53%, 26%)
CMYK
cmyk(0%, 2%, 53%, 74%)
Oklch
oklch(36.7% 0.052 107.2)

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

#ABA307

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#ABA307
RGB
rgb(171, 163, 7)
HSL
hsl(57, 92%, 35%)
HSB
hsb(57, 96%, 67%)
CMYK
cmyk(0%, 5%, 96%, 33%)
Oklch
oklch(70.0% 0.148 106.1)

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

#BAB99E

Fresh Green · DarkGray · Sunflower

HEX
#BAB99E
RGB
rgb(186, 185, 158)
HSL
hsl(58, 17%, 67%)
HSB
hsb(58, 15%, 73%)
CMYK
cmyk(0%, 1%, 15%, 27%)
Oklch
oklch(77.9% 0.037 105.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#191A17

Ink Black · Black · Jet Black

HEX
#191A17
RGB
rgb(25, 26, 23)
HSL
hsl(80, 6%, 10%)
HSB
hsb(80, 12%, 10%)
CMYK
cmyk(4%, 0%, 12%, 90%)
Oklch
oklch(21.6% 0.006 121.9)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#217A71

Mineral Blue · SeaGreen · Mint Ice

HEX
#217A71
RGB
rgb(33, 122, 113)
HSL
hsl(174, 57%, 30%)
HSB
hsb(174, 73%, 48%)
CMYK
cmyk(73%, 0%, 7%, 52%)
Oklch
oklch(52.6% 0.082 185.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

42411F
1F2042

Analogous

422F1F
42411F
32421F

Triadic

42411F
1F4241
411F42

Split-Comp.

42411F
1F3242
2F1F42

Tetradic

42411F
1F422F
1F2042
421F32

Contrast Matrix WCAG 2.1 Contrast

42411F
ABA307
BAB99E
191A17
217A71
—
4.0
AA Large
5.2
AA
1.7
Fail
2.0
Fail
4.0
AA Large
—
1.3
Fail
6.6
AA
2.0
Fail
5.2
AA
1.3
Fail
—
8.8
AAA
2.6
Fail
1.7
Fail
6.6
AA
8.8
AAA
—
3.4
AA Large
2.0
Fail
2.0
Fail
2.6
Fail
3.4
AA Large
—
White BG
10.5AAA
2.6Fail
2.0Fail
17.5AAA
5.1AA
Black BG
2.0Fail
8.0AAA
10.5AAA
1.2Fail
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

424227
A8A72D
BABAA5
191918
484873

Deuteranopia

424229
A8A936
BABAA6
191918
423C74

Tritanopia

422E2F
AB4B51
BAAAAB
191818
257575

Achromatopsia

3D3D3D
949494
B6B6B6
191919
5E5E5E

Shades & Tints Shades & Tints

#42411F

Dark
Light

#ABA307

Dark
Light

#BAB99E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #42411f;
  --color-2: #aba307;
  --color-3: #bab99e;
  --color-4: #191a17;
  --color-5: #217a71;
}

SCSS

$color-1: #42411f;
$color-2: #aba307;
$color-3: #bab99e;
$color-4: #191a17;
$color-5: #217a71;

TAILWIND

colors: {
  'brand-1': '#42411f',
  'brand-2': '#aba307',
  'brand-3': '#bab99e',
  'brand-4': '#191a17',
  'brand-5': '#217a71',
}

RGB Array

[66, 65, 31], [171, 163, 7], [186, 185, 158], [25, 26, 23], [33, 122, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #42411F, #ABA307, #BAB99E, #191A17, #217A71 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: #42411f; --color-2: #aba307; --color-3: #bab99e; --color-4: #191a17; --color-5: #217a71. 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