#F2895C + #DA727E + #AC6C82 + #685C79 + #455C7B · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#F2895C

Apricot · Coral · Warm Sun

HEX

#F2895C

RGB

rgb(242, 137, 92)

HSL

hsl(18, 85%, 65%)

HSB

hsb(18, 62%, 95%)

CMYK

cmyk(0%, 43%, 62%, 5%)

Oklch

oklch(73.5% 0.142 43.3)

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

#DA727E

Peach Pink · LightCoral · Coral Red

HEX

#DA727E

RGB

rgb(218, 114, 126)

HSL

hsl(353, 58%, 65%)

HSB

hsb(353, 48%, 85%)

CMYK

cmyk(0%, 48%, 42%, 15%)

Oklch

oklch(67.4% 0.130 13.9)

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

#AC6C82

Dark Violet · Gray · Rose Pink

HEX

#AC6C82

RGB

rgb(172, 108, 130)

HSL

hsl(339, 28%, 55%)

HSB

hsb(339, 37%, 67%)

CMYK

cmyk(0%, 37%, 24%, 33%)

Oklch

oklch(60.7% 0.086 357.8)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#685C79

Deep Indigo · DimGray · Violet

HEX

#685C79

RGB

rgb(104, 92, 121)

HSL

hsl(265, 14%, 42%)

HSB

hsb(265, 24%, 47%)

CMYK

cmyk(14%, 24%, 0%, 53%)

Oklch

oklch(49.7% 0.048 303.6)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#455C7B

Indigo · DarkSlateBlue · Prussian Blue

HEX

#455C7B

RGB

rgb(69, 92, 123)

HSL

hsl(214, 28%, 38%)

HSB

hsb(214, 44%, 48%)

CMYK

cmyk(44%, 25%, 0%, 52%)

Oklch

oklch(46.9% 0.058 256.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2895C

5AC4F2

Analogous

F25A78

F2895C

F2D35A

Triadic

F2895C

5AF287

875AF2

Split-Comp.

F2895C

5AF2D3

5A78F2

Tetradic

F2895C

78F25A

5AC4F2

D35AF2

Contrast Matrix WCAG 2.1 Contrast

F2895C	DA727E	AC6C82	685C79	455C7B
—	1.3 Fail	1.6 Fail	2.5 Fail	2.8 Fail
1.3 Fail	—	1.3 Fail	2.0 Fail	2.2 Fail
1.6 Fail	1.3 Fail	—	1.5 Fail	1.7 Fail
2.5 Fail	2.0 Fail	1.5 Fail	—	1.1 Fail
2.8 Fail	2.2 Fail	1.7 Fail	1.1 Fail	—

White BG

2.5Fail

3.1AA Large

4.0AA Large

6.2AA

6.8AA

Black BG

8.5AAA

6.7AA

5.2AA

3.4AA Large

3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C467

ADAC7B

90907D

636372

4F4F73

Deuteranopia

CBD26A

B3BB7A

94997B

646470

4E4C72

Tritanopia

ED6F71

D57978

A97878

676C6B

466E6C

Achromatopsia

A3A3A3

929292

828282

636363

595959

Shades & Tints Shades & Tints

#F2895C

Dark

Light

#DA727E

Dark

Light

#AC6C82

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2895c;
  --color-2: #da727e;
  --color-3: #ac6c82;
  --color-4: #685c79;
  --color-5: #455c7b;
}

SCSS

$color-1: #f2895c;
$color-2: #da727e;
$color-3: #ac6c82;
$color-4: #685c79;
$color-5: #455c7b;

TAILWIND

colors: {
  'brand-1': '#f2895c',
  'brand-2': '#da727e',
  'brand-3': '#ac6c82',
  'brand-4': '#685c79',
  'brand-5': '#455c7b',
}

RGB Array

[242, 137, 92], [218, 114, 126], [172, 108, 130], [104, 92, 121], [69, 92, 123]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #F2895C, #DA727E, #AC6C82, #685C79, #455C7B 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: #f2895c; --color-2: #da727e; --color-3: #ac6c82; --color-4: #685c79; --color-5: #455c7b. 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