← Back to Editor

#F9DDD1 · #F3BEBA · #F7AD7E · #F98A90 · #5C6670

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

#F9DDD1

Apricot · Bisque · Peach Orange

HEX
#F9DDD1
RGB
rgb(249, 221, 209)
HSL
hsl(18, 77%, 90%)
HSB
hsb(18, 16%, 98%)
CMYK
cmyk(0%, 11%, 16%, 2%)
Oklch
oklch(91.7% 0.035 44.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F3BEBA

Peach Pink · LightPink · Cherry Blossom

HEX
#F3BEBA
RGB
rgb(243, 190, 186)
HSL
hsl(4, 70%, 84%)
HSB
hsb(4, 23%, 95%)
CMYK
cmyk(0%, 22%, 23%, 5%)
Oklch
oklch(84.8% 0.062 23.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#F7AD7E

Apricot · LightSalmon · Warm Sun

HEX
#F7AD7E
RGB
rgb(247, 173, 126)
HSL
hsl(23, 88%, 73%)
HSB
hsb(23, 49%, 97%)
CMYK
cmyk(0%, 30%, 49%, 3%)
Oklch
oklch(80.8% 0.107 53.1)

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

#F98A90

Peach Pink · LightCoral · Coral Red

HEX
#F98A90
RGB
rgb(249, 138, 144)
HSL
hsl(357, 90%, 76%)
HSB
hsb(357, 45%, 98%)
CMYK
cmyk(0%, 45%, 42%, 2%)
Oklch
oklch(75.5% 0.135 17.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#5C6670

Indigo · DimGray · Prussian Blue

HEX
#5C6670
RGB
rgb(92, 102, 112)
HSL
hsl(210, 10%, 40%)
HSB
hsb(210, 18%, 44%)
CMYK
cmyk(18%, 9%, 0%, 56%)
Oklch
oklch(50.5% 0.020 248.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9DDD1
D2EDF9

Analogous

F9D2DA
F9DDD1
F9F1D2

Triadic

F9DDD1
D2F9DE
DED2F9

Split-Comp.

F9DDD1
D2F9F1
D2DAF9

Tetradic

F9DDD1
DAF9D2
D2EDF9
F1D2F9

Contrast Matrix WCAG 2.1 Contrast

F9DDD1
F3BEBA
F7AD7E
F98A90
5C6670
—
1.3
Fail
1.5
Fail
1.8
Fail
4.5
AA
1.3
Fail
—
1.1
Fail
1.4
Fail
3.6
AA Large
1.5
Fail
1.1
Fail
—
1.2
Fail
3.1
AA Large
1.8
Fail
1.4
Fail
1.2
Fail
—
2.5
Fail
4.5
AA
3.6
AA Large
3.1
AA Large
2.5
Fail
—
White BG
1.3Fail
1.6Fail
1.9Fail
2.3Fail
5.9AA
Black BG
16.3AAA
12.9AAA
11.2AAA
9.1AAA
3.6AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDD4
DCDCBB
D7D689
C9C88F
60606E

Deuteranopia

EFF1D5
DFE3BB
DBE18C
CFD88E
605F6D

Tritanopia

F8D6D7
F0BCBC
F39294
F38D8D
5C6C6B

Achromatopsia

E4E4E4
CDCDCD
BEBEBE
ACACAC
646464

Shades & Tints Shades & Tints

#F9DDD1

Dark
Light

#F3BEBA

Dark
Light

#F7AD7E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9ddd1;
  --color-2: #f3beba;
  --color-3: #f7ad7e;
  --color-4: #f98a90;
  --color-5: #5c6670;
}

SCSS

$color-1: #f9ddd1;
$color-2: #f3beba;
$color-3: #f7ad7e;
$color-4: #f98a90;
$color-5: #5c6670;

TAILWIND

colors: {
  'brand-1': '#f9ddd1',
  'brand-2': '#f3beba',
  'brand-3': '#f7ad7e',
  'brand-4': '#f98a90',
  'brand-5': '#5c6670',
}

RGB Array

[249, 221, 209], [243, 190, 186], [247, 173, 126], [249, 138, 144], [92, 102, 112]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #F9DDD1, #F3BEBA, #F7AD7E, #F98A90, #5C6670 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, 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: #f9ddd1; --color-2: #f3beba; --color-3: #f7ad7e; --color-4: #f98a90; --color-5: #5c6670. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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