← Back to Editor

#1F2720 · #683005 · #F09F12 · #F3ED89 · #3E6146

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

#1F2720

Celadon · Black · Dark Green

HEX
#1F2720
RGB
rgb(31, 39, 32)
HSL
hsl(128, 11%, 14%)
HSB
hsb(128, 21%, 15%)
CMYK
cmyk(21%, 0%, 18%, 85%)
Oklch
oklch(26.2% 0.017 148.6)

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

#683005

Tangerine · Maroon · Cinnamon

HEX
#683005
RGB
rgb(104, 48, 5)
HSL
hsl(26, 91%, 21%)
HSB
hsb(26, 95%, 41%)
CMYK
cmyk(0%, 54%, 95%, 59%)
Oklch
oklch(37.8% 0.095 51.0)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#F09F12

Ginger · Orange · Warm Sun

HEX
#F09F12
RGB
rgb(240, 159, 18)
HSL
hsl(38, 88%, 51%)
HSB
hsb(38, 93%, 94%)
CMYK
cmyk(0%, 34%, 93%, 6%)
Oklch
oklch(76.5% 0.160 72.1)

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

#F3ED89

Fresh Green · Khaki · Sunflower

HEX
#F3ED89
RGB
rgb(243, 237, 137)
HSL
hsl(57, 82%, 75%)
HSB
hsb(57, 44%, 95%)
CMYK
cmyk(0%, 2%, 44%, 5%)
Oklch
oklch(93.0% 0.122 105.5)

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

#3E6146

Celadon · DarkSlateGray · Forest Green

HEX
#3E6146
RGB
rgb(62, 97, 70)
HSL
hsl(134, 22%, 31%)
HSB
hsb(134, 36%, 38%)
CMYK
cmyk(36%, 0%, 28%, 62%)
Oklch
oklch(45.8% 0.060 150.7)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1F2720
282027

Analogous

232820
1F2720
202825

Triadic

1F2720
212028
282120

Split-Comp.

1F2720
252028
282023

Tetradic

1F2720
202328
282027
282520

Contrast Matrix WCAG 2.1 Contrast

1F2720
683005
F09F12
F3ED89
3E6146
—
1.5
Fail
7.1
AAA
12.6
AAA
2.2
Fail
1.5
Fail
—
4.8
AA
8.6
AAA
1.5
Fail
7.1
AAA
4.8
AA
—
1.8
Fail
3.2
AA Large
12.6
AAA
8.6
AAA
1.8
Fail
—
5.8
AA
2.2
Fail
1.5
Fail
3.2
AA Large
5.8
AA
—
White BG
15.3AAA
10.4AAA
2.2Fail
1.2Fail
7.0AA
Black BG
1.4Fail
2.0Fail
9.7AAA
17.3AAA
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

222322
504F0F
CDCC34
F0F0A1
4D4D4D

Deuteranopia

222122
535712
D2D83C
F1F1A7
4B494E

Tritanopia

1F2323
651819
EC4F55
F3B4B9
405253

Achromatopsia

242424
3C3C3C
A7A7A7
E3E3E3
535353

Shades & Tints Shades & Tints

#1F2720

Dark
Light

#683005

Dark
Light

#F09F12

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1f2720;
  --color-2: #683005;
  --color-3: #f09f12;
  --color-4: #f3ed89;
  --color-5: #3e6146;
}

SCSS

$color-1: #1f2720;
$color-2: #683005;
$color-3: #f09f12;
$color-4: #f3ed89;
$color-5: #3e6146;

TAILWIND

colors: {
  'brand-1': '#1f2720',
  'brand-2': '#683005',
  'brand-3': '#f09f12',
  'brand-4': '#f3ed89',
  'brand-5': '#3e6146',
}

RGB Array

[31, 39, 32], [104, 48, 5], [240, 159, 18], [243, 237, 137], [62, 97, 70]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #1F2720, #683005, #F09F12, #F3ED89, #3E6146 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: #1f2720; --color-2: #683005; --color-3: #f09f12; --color-4: #f3ed89; --color-5: #3e6146. 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