← Back to Editor

#F2D183 · #F2A566 · #F29272 · #F27276 · #6B5F56

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#F2D183

Goose Yellow · Khaki · Sunflower

HEX
#F2D183
RGB
rgb(242, 209, 131)
HSL
hsl(42, 81%, 73%)
HSB
hsb(42, 46%, 95%)
CMYK
cmyk(0%, 14%, 46%, 5%)
Oklch
oklch(87.2% 0.104 87.3)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#F2A566

Apricot · SandyBrown · Warm Sun

HEX
#F2A566
RGB
rgb(242, 165, 102)
HSL
hsl(27, 84%, 67%)
HSB
hsb(27, 58%, 95%)
CMYK
cmyk(0%, 32%, 58%, 5%)
Oklch
oklch(78.4% 0.121 59.0)

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

#F29272

Apricot · DarkSalmon · Warm Sun

HEX
#F29272
RGB
rgb(242, 146, 114)
HSL
hsl(15, 83%, 70%)
HSB
hsb(15, 53%, 95%)
CMYK
cmyk(0%, 40%, 53%, 5%)
Oklch
oklch(75.3% 0.125 39.2)

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

#F27276

Peach Pink · Salmon · Coral Red

HEX
#F27276
RGB
rgb(242, 114, 118)
HSL
hsl(358, 83%, 70%)
HSB
hsb(358, 53%, 95%)
CMYK
cmyk(0%, 53%, 51%, 5%)
Oklch
oklch(70.5% 0.158 20.1)

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

#6B5F56

Tangerine · DimGray · Amber Brown

HEX
#6B5F56
RGB
rgb(107, 95, 86)
HSL
hsl(26, 11%, 38%)
HSB
hsb(26, 20%, 42%)
CMYK
cmyk(0%, 11%, 20%, 58%)
Oklch
oklch(49.4% 0.021 59.1)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2D183
82A4F2

Analogous

F29982
F2D183
DCF282

Triadic

F2D183
82F2D0
D082F2

Split-Comp.

F2D183
82DCF2
9982F2

Tetradic

F2D183
82F299
82A4F2
F282DC

Contrast Matrix WCAG 2.1 Contrast

F2D183
F2A566
F29272
F27276
6B5F56
—
1.4
Fail
1.6
Fail
1.9
Fail
4.2
AA Large
1.4
Fail
—
1.1
Fail
1.4
Fail
3.0
AA Large
1.6
Fail
1.1
Fail
—
1.2
Fail
2.7
Fail
1.9
Fail
1.4
Fail
1.2
Fail
—
2.2
Fail
4.2
AA Large
3.0
AA Large
2.7
Fail
2.2
Fail
—
White BG
1.5Fail
2.0Fail
2.3Fail
2.8Fail
6.2AA
Black BG
14.2AAA
10.3AAA
9.1AAA
7.4AAA
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

E4E396
D1D075
C8C87A
BBB975
666658

Deuteranopia

E6E89A
D5DB79
CED57C
C2CC75
676759

Tritanopia

F0A5A8
EE8184
ED8081
EC7474
6A5A5A

Achromatopsia

D2D2D2
B5B5B5
ABABAB
999999
626262

Shades & Tints Shades & Tints

#F2D183

Dark
Light

#F2A566

Dark
Light

#F29272

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2d183;
  --color-2: #f2a566;
  --color-3: #f29272;
  --color-4: #f27276;
  --color-5: #6b5f56;
}

SCSS

$color-1: #f2d183;
$color-2: #f2a566;
$color-3: #f29272;
$color-4: #f27276;
$color-5: #6b5f56;

TAILWIND

colors: {
  'brand-1': '#f2d183',
  'brand-2': '#f2a566',
  'brand-3': '#f29272',
  'brand-4': '#f27276',
  'brand-5': '#6b5f56',
}

RGB Array

[242, 209, 131], [242, 165, 102], [242, 146, 114], [242, 114, 118], [107, 95, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #F2D183, #F2A566, #F29272, #F27276, #6B5F56 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #f2d183; --color-2: #f2a566; --color-3: #f29272; --color-4: #f27276; --color-5: #6b5f56. 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 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