← Back to Editor

#30182B · #F0F1BC · #60F0C0 · #FF360E · #191F04

sea

A 5-color sea palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#30182B

Rose Purple · DarkSlateGray · Dark Purple

HEX
#30182B
RGB
rgb(48, 24, 43)
HSL
hsl(312, 33%, 14%)
HSB
hsb(312, 50%, 19%)
CMYK
cmyk(0%, 50%, 10%, 81%)
Oklch
oklch(25.0% 0.049 335.1)

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

#F0F1BC

Fresh Green · Bisque · Lemon Cream

HEX
#F0F1BC
RGB
rgb(240, 241, 188)
HSL
hsl(61, 65%, 84%)
HSB
hsb(61, 22%, 95%)
CMYK
cmyk(0%, 0%, 22%, 5%)
Oklch
oklch(94.4% 0.069 108.5)

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

#60F0C0

Jade · Turquoise · Lake Green

HEX
#60F0C0
RGB
rgb(96, 240, 192)
HSL
hsl(160, 83%, 66%)
HSB
hsb(160, 60%, 94%)
CMYK
cmyk(60%, 0%, 20%, 6%)
Oklch
oklch(86.4% 0.142 167.8)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#FF360E

Vermilion · OrangeRed · Passion Red

HEX
#FF360E
RGB
rgb(255, 54, 14)
HSL
hsl(10, 100%, 53%)
HSB
hsb(10, 95%, 100%)
CMYK
cmyk(0%, 79%, 95%, 0%)
Oklch
oklch(64.9% 0.238 32.2)

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

#191F04

Grass Green · Black · Dark Green

HEX
#191F04
RGB
rgb(25, 31, 4)
HSL
hsl(73, 77%, 7%)
HSB
hsb(73, 87%, 12%)
CMYK
cmyk(19%, 0%, 87%, 88%)
Oklch
oklch(22.6% 0.046 120.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

30182B
182F1D

Analogous

28182F
30182B
2F181F

Triadic

30182B
2B2F18
182B2F

Split-Comp.

30182B
1F2F18
182F28

Tetradic

30182B
2F2818
182F1D
181F2F

Contrast Matrix WCAG 2.1 Contrast

30182B
F0F1BC
60F0C0
FF360E
191F04
—
14.0
AAA
11.4
AAA
4.5
AA Large
1.0
Fail
14.0
AAA
—
1.2
Fail
3.1
AA Large
14.5
AAA
11.4
AAA
1.2
Fail
—
2.5
Fail
11.9
AAA
4.5
AA Large
3.1
AA Large
2.5
Fail
—
4.7
AA
1.0
Fail
14.5
AAA
11.9
AAA
4.7
AA
—
White BG
16.3AAA
1.2Fail
1.4Fail
3.6AA Large
16.9AAA
Black BG
1.3Fail
18.0AAA
14.7AAA
5.8AA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

262526
F0F0C9
9EA0CC
A8A618
1C1C0B

Deuteranopia

272925
F0F0CC
968BCE
B4C31A
1B1B0C

Tritanopia

2F2322
F0D3D5
67D5D7
F51F21
191011

Achromatopsia

212121
EBEBEB
BFBFBF
6E6E6E
1A1A1A

Shades & Tints Shades & Tints

#30182B

Dark
Light

#F0F1BC

Dark
Light

#60F0C0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #30182b;
  --color-2: #f0f1bc;
  --color-3: #60f0c0;
  --color-4: #ff360e;
  --color-5: #191f04;
}

SCSS

$color-1: #30182b;
$color-2: #f0f1bc;
$color-3: #60f0c0;
$color-4: #ff360e;
$color-5: #191f04;

TAILWIND

colors: {
  'brand-1': '#30182b',
  'brand-2': '#f0f1bc',
  'brand-3': '#60f0c0',
  'brand-4': '#ff360e',
  'brand-5': '#191f04',
}

RGB Array

[48, 24, 43], [240, 241, 188], [96, 240, 192], [255, 54, 14], [25, 31, 4]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #30182B, #F0F1BC, #60F0C0, #FF360E, #191F04 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #30182b; --color-2: #f0f1bc; --color-3: #60f0c0; --color-4: #ff360e; --color-5: #191f04. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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