← Back to Editor

#FBE97D · #E7B755 · #4F9C64 · #1B6B6A · #0F3D4C

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

#FBE97D

Fresh Green · Khaki · Sunflower

HEX
#FBE97D
RGB
rgb(251, 233, 125)
HSL
hsl(51, 94%, 74%)
HSB
hsb(51, 50%, 98%)
CMYK
cmyk(0%, 7%, 50%, 2%)
Oklch
oklch(92.7% 0.130 100.0)

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

#E7B755

Ginger · SandyBrown · Sunflower

HEX
#E7B755
RGB
rgb(231, 183, 85)
HSL
hsl(40, 75%, 62%)
HSB
hsb(40, 63%, 91%)
CMYK
cmyk(0%, 21%, 63%, 9%)
Oklch
oklch(80.4% 0.128 82.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#4F9C64

Celadon · MediumSeaGreen · Olive Green

HEX
#4F9C64
RGB
rgb(79, 156, 100)
HSL
hsl(136, 33%, 46%)
HSB
hsb(136, 49%, 61%)
CMYK
cmyk(49%, 0%, 36%, 39%)
Oklch
oklch(62.8% 0.114 150.8)

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

#1B6B6A

Mineral Blue · Teal · Mint Ice

HEX
#1B6B6A
RGB
rgb(27, 107, 106)
HSL
hsl(179, 60%, 26%)
HSB
hsb(179, 75%, 42%)
CMYK
cmyk(75%, 0%, 1%, 58%)
Oklch
oklch(48.2% 0.074 193.7)

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

#0F3D4C

Lake Blue · DarkSlateGray · Peacock Green

HEX
#0F3D4C
RGB
rgb(15, 61, 76)
HSL
hsl(195, 67%, 18%)
HSB
hsb(195, 80%, 30%)
CMYK
cmyk(80%, 20%, 0%, 70%)
Oklch
oklch(33.7% 0.055 224.0)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBE97D
7E91FB

Analogous

FBAA7E
FBE97D
CFFB7E

Triadic

FBE97D
7EFBE8
E87EFB

Split-Comp.

FBE97D
7ECFFB
AA7EFB

Tetradic

FBE97D
7EFBAA
7E91FB
FB7ECF

Contrast Matrix WCAG 2.1 Contrast

FBE97D
E7B755
4F9C64
1B6B6A
0F3D4C
—
1.5
Fail
2.7
Fail
5.1
AA
9.5
AAA
1.5
Fail
—
1.8
Fail
3.4
AA Large
6.3
AA
2.7
Fail
1.8
Fail
—
1.9
Fail
3.5
AA Large
5.1
AA
3.4
AA Large
1.9
Fail
—
1.9
Fail
9.5
AAA
6.3
AA
3.5
AA Large
1.9
Fail
—
White BG
1.2Fail
1.9Fail
3.3AA Large
6.3AA
11.7AAA
Black BG
17.1AAA
11.3AAA
6.3AA
3.4AA Large
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F397
D2D26D
707172
3E3E6A
232348

Deuteranopia

F4F69D
D5D972
6C6675
39336A
201D48

Tritanopia

FAACB0
E57F84
537C7F
1F6A6A
114645

Achromatopsia

E2E2E2
BABABA
7F7F7F
535353
313131

Shades & Tints Shades & Tints

#FBE97D

Dark
Light

#E7B755

Dark
Light

#4F9C64

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbe97d;
  --color-2: #e7b755;
  --color-3: #4f9c64;
  --color-4: #1b6b6a;
  --color-5: #0f3d4c;
}

SCSS

$color-1: #fbe97d;
$color-2: #e7b755;
$color-3: #4f9c64;
$color-4: #1b6b6a;
$color-5: #0f3d4c;

TAILWIND

colors: {
  'brand-1': '#fbe97d',
  'brand-2': '#e7b755',
  'brand-3': '#4f9c64',
  'brand-4': '#1b6b6a',
  'brand-5': '#0f3d4c',
}

RGB Array

[251, 233, 125], [231, 183, 85], [79, 156, 100], [27, 107, 106], [15, 61, 76]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #FBE97D, #E7B755, #4F9C64, #1B6B6A, #0F3D4C 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: #fbe97d; --color-2: #e7b755; --color-3: #4f9c64; --color-4: #1b6b6a; --color-5: #0f3d4c. 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