← Back to Editor

#F1D4A5 · #79D1B9 · #94A79D · #918081 · #EDA63E

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 Library

Color Details Color Details

#F1D4A5

Goose Yellow · Wheat · Peach Orange

HEX
#F1D4A5
RGB
rgb(241, 212, 165)
HSL
hsl(37, 73%, 80%)
HSB
hsb(37, 32%, 95%)
CMYK
cmyk(0%, 12%, 32%, 5%)
Oklch
oklch(88.3% 0.069 79.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#79D1B9

Jade · MediumAquaMarine · Lake Green

HEX
#79D1B9
RGB
rgb(121, 209, 185)
HSL
hsl(164, 49%, 65%)
HSB
hsb(164, 42%, 82%)
CMYK
cmyk(42%, 0%, 11%, 18%)
Oklch
oklch(79.8% 0.093 174.3)

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

#94A79D

Celadon · DarkGray · Apple Green

HEX
#94A79D
RGB
rgb(148, 167, 157)
HSL
hsl(148, 10%, 62%)
HSB
hsb(148, 11%, 65%)
CMYK
cmyk(11%, 0%, 6%, 35%)
Oklch
oklch(71.1% 0.026 162.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#918081

Ash · Gray · Warm Gray

HEX
#918081
RGB
rgb(145, 128, 129)
HSL
hsl(356, 7%, 54%)
HSB
hsb(356, 12%, 57%)
CMYK
cmyk(0%, 12%, 11%, 43%)
Oklch
oklch(61.6% 0.021 13.7)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#EDA63E

Ginger · SandyBrown · Warm Sun

HEX
#EDA63E
RGB
rgb(237, 166, 62)
HSL
hsl(36, 83%, 59%)
HSB
hsb(36, 74%, 93%)
CMYK
cmyk(0%, 30%, 74%, 7%)
Oklch
oklch(77.6% 0.142 72.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1D4A5
A7C3F1

Analogous

F1AFA7
F1D4A5
E9F1A7

Triadic

F1D4A5
A7F1D5
D5A7F1

Split-Comp.

F1D4A5
A7E9F1
AFA7F1

Tetradic

F1D4A5
A7F1AF
A7C3F1
F1A7E9

Contrast Matrix WCAG 2.1 Contrast

F1D4A5
79D1B9
94A79D
918081
EDA63E
—
1.3
Fail
1.8
Fail
2.6
Fail
1.5
Fail
1.3
Fail
—
1.4
Fail
2.1
Fail
1.1
Fail
1.8
Fail
1.4
Fail
—
1.5
Fail
1.2
Fail
2.6
Fail
2.1
Fail
1.5
Fail
—
1.8
Fail
1.5
Fail
1.1
Fail
1.2
Fail
1.8
Fail
—
White BG
1.4Fail
1.8Fail
2.5Fail
3.7AA Large
2.1Fail
Black BG
14.7AAA
11.6AAA
8.3AAA
5.6AA
10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E4E4B0
9FA0BF
9C9C9F
8A8981
CECE57

Deuteranopia

E6E8B3
9A93C0
9B9AA0
8B8C81
D2D85D

Tritanopia

F0B9BB
7DC3C4
95A1A2
908181
E96B6F

Achromatopsia

D7D7D7
B4B4B4
A0A0A0
858585
AFAFAF

Shades & Tints Shades & Tints

#F1D4A5

Dark
Light

#79D1B9

Dark
Light

#94A79D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1d4a5;
  --color-2: #79d1b9;
  --color-3: #94a79d;
  --color-4: #918081;
  --color-5: #eda63e;
}

SCSS

$color-1: #f1d4a5;
$color-2: #79d1b9;
$color-3: #94a79d;
$color-4: #918081;
$color-5: #eda63e;

TAILWIND

colors: {
  'brand-1': '#f1d4a5',
  'brand-2': '#79d1b9',
  'brand-3': '#94a79d',
  'brand-4': '#918081',
  'brand-5': '#eda63e',
}

RGB Array

[241, 212, 165], [121, 209, 185], [148, 167, 157], [145, 128, 129], [237, 166, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #F1D4A5, #79D1B9, #94A79D, #918081, #EDA63E is ideal for: corporate websites, product showcases, portfolios. 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: #f1d4a5; --color-2: #79d1b9; --color-3: #94a79d; --color-4: #918081; --color-5: #eda63e. 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. 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