← Back to Editor

#24284A · #0AA9B2 · #D5B98C · #F8F7AD · #2F0F1C

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

#24284A

Indigo · DarkSlateGray · Prussian Blue

HEX
#24284A
RGB
rgb(36, 40, 74)
HSL
hsl(234, 35%, 22%)
HSB
hsb(234, 51%, 29%)
CMYK
cmyk(51%, 46%, 0%, 71%)
Oklch
oklch(29.1% 0.062 276.8)

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

#0AA9B2

Lake Blue · LightSeaGreen · Mint Ice

HEX
#0AA9B2
RGB
rgb(10, 169, 178)
HSL
hsl(183, 89%, 37%)
HSB
hsb(183, 94%, 70%)
CMYK
cmyk(94%, 5%, 0%, 30%)
Oklch
oklch(66.9% 0.113 201.6)

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

#D5B98C

Ginger · Tan · Warm Sun

HEX
#D5B98C
RGB
rgb(213, 185, 140)
HSL
hsl(37, 46%, 69%)
HSB
hsb(37, 34%, 84%)
CMYK
cmyk(0%, 13%, 34%, 16%)
Oklch
oklch(79.9% 0.068 79.3)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#F8F7AD

Fresh Green · Wheat · Lemon Cream

HEX
#F8F7AD
RGB
rgb(248, 247, 173)
HSL
hsl(59, 84%, 83%)
HSB
hsb(59, 30%, 97%)
CMYK
cmyk(0%, 0%, 30%, 3%)
Oklch
oklch(96.0% 0.093 107.4)

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

#2F0F1C

Dark Violet · Black · Raspberry

HEX
#2F0F1C
RGB
rgb(47, 15, 28)
HSL
hsl(336, 52%, 12%)
HSB
hsb(336, 68%, 18%)
CMYK
cmyk(0%, 68%, 40%, 82%)
Oklch
oklch(22.5% 0.055 357.0)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

24284A
4C4824

Analogous

243C4C
24284A
34244C

Triadic

24284A
4C2428
284C24

Split-Comp.

24284A
4C3424
3C4C24

Tetradic

24284A
4C243C
4C4824
244C34

Contrast Matrix WCAG 2.1 Contrast

24284A
0AA9B2
D5B98C
F8F7AD
2F0F1C
—
5.0
AA
7.5
AAA
12.8
AAA
1.2
Fail
5.0
AA
—
1.5
Fail
2.6
Fail
6.1
AA
7.5
AAA
1.5
Fail
—
1.7
Fail
9.2
AAA
12.8
AAA
2.6
Fail
1.7
Fail
—
15.7
AAA
1.2
Fail
6.1
AA
9.2
AAA
15.7
AAA
—
White BG
14.2AAA
2.9Fail
1.9Fail
1.1Fail
17.4AAA
Black BG
1.5Fail
7.3AAA
11.1AAA
18.9AAA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

262642
4F50B0
C9C997
F8F8BF
212119

Deuteranopia

262540
463AAF
CBCD9A
F8F8C3
232518

Tritanopia

243B3A
12AEAE
D49FA1
F8CDD0
2D1616

Achromatopsia

2B2B2B
7A7A7A
BCBCBC
EFEFEF
1A1A1A

Shades & Tints Shades & Tints

#24284A

Dark
Light

#0AA9B2

Dark
Light

#D5B98C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #24284a;
  --color-2: #0aa9b2;
  --color-3: #d5b98c;
  --color-4: #f8f7ad;
  --color-5: #2f0f1c;
}

SCSS

$color-1: #24284a;
$color-2: #0aa9b2;
$color-3: #d5b98c;
$color-4: #f8f7ad;
$color-5: #2f0f1c;

TAILWIND

colors: {
  'brand-1': '#24284a',
  'brand-2': '#0aa9b2',
  'brand-3': '#d5b98c',
  'brand-4': '#f8f7ad',
  'brand-5': '#2f0f1c',
}

RGB Array

[36, 40, 74], [10, 169, 178], [213, 185, 140], [248, 247, 173], [47, 15, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #24284A, #0AA9B2, #D5B98C, #F8F7AD, #2F0F1C 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: #24284a; --color-2: #0aa9b2; --color-3: #d5b98c; --color-4: #f8f7ad; --color-5: #2f0f1c. 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