#BD174B + #CEEBB0 + #7FC8B0 + #64B39F + #509992 · 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

#BD174B

Dark Violet · Crimson · Camellia

HEX

#BD174B

RGB

rgb(189, 23, 75)

HSL

hsl(341, 78%, 42%)

HSB

hsb(341, 88%, 74%)

CMYK

cmyk(0%, 88%, 60%, 26%)

Oklch

oklch(51.8% 0.195 11.3)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#CEEBB0

Willow Green · Wheat · Mint Green

HEX

#CEEBB0

RGB

rgb(206, 235, 176)

HSL

hsl(89, 60%, 81%)

HSB

hsb(89, 25%, 92%)

CMYK

cmyk(12%, 0%, 25%, 8%)

Oklch

oklch(90.4% 0.084 129.2)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#7FC8B0

Jade · MediumAquaMarine · Lake Green

HEX

#7FC8B0

RGB

rgb(127, 200, 176)

HSL

hsl(160, 40%, 64%)

HSB

hsb(160, 37%, 78%)

CMYK

cmyk(37%, 0%, 12%, 22%)

Oklch

oklch(77.8% 0.081 171.3)

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

#64B39F

Mineral Blue · CadetBlue · Lake Green

HEX

#64B39F

RGB

rgb(100, 179, 159)

HSL

hsl(165, 34%, 55%)

HSB

hsb(165, 44%, 70%)

CMYK

cmyk(44%, 0%, 11%, 30%)

Oklch

oklch(71.0% 0.084 175.5)

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

#509992

Mineral Blue · CadetBlue · Mint Ice

HEX

#509992

RGB

rgb(80, 153, 146)

HSL

hsl(174, 31%, 46%)

HSB

hsb(174, 48%, 60%)

CMYK

cmyk(48%, 0%, 5%, 40%)

Oklch

oklch(63.4% 0.074 187.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BD174B

18BF8A

Analogous

BF18A0

BD174B

BF3618

Triadic

BD174B

4CBF18

184CBF

Split-Comp.

BD174B

18BF36

18A0BF

Tetradic

BD174B

A0BF18

18BF8A

3618BF

Contrast Matrix WCAG 2.1 Contrast

BD174B	CEEBB0	7FC8B0	64B39F	509992
—	4.8 AA	3.2 AA Large	2.5 Fail	1.9 Fail
4.8 AA	—	1.5 Fail	1.9 Fail	2.6 Fail
3.2 AA Large	1.5 Fail	—	1.3 Fail	1.7 Fail
2.5 Fail	1.9 Fail	1.3 Fail	—	1.3 Fail
1.9 Fail	2.6 Fail	1.7 Fail	1.3 Fail	—

White BG

6.2AA

1.3Fail

1.9Fail

2.5Fail

3.3AA Large

Black BG

3.4AA Large

16.1AAA

10.8AAA

8.5AAA

6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

75743E

DBDBBE

9F9FB6

8687A4

707094

Deuteranopia

7F8B3B

D9D7C2

9A95B7

827CA5

6B6694

Tritanopia

B53432

CFCACC

83BABB

68A8A9

549595

Achromatopsia

4F4F4F

DCDCDC

AFAFAF

999999

828282

Shades & Tints Shades & Tints

#BD174B

Dark

Light

#CEEBB0

Dark

Light

#7FC8B0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bd174b;
  --color-2: #ceebb0;
  --color-3: #7fc8b0;
  --color-4: #64b39f;
  --color-5: #509992;
}

SCSS

$color-1: #bd174b;
$color-2: #ceebb0;
$color-3: #7fc8b0;
$color-4: #64b39f;
$color-5: #509992;

TAILWIND

colors: {
  'brand-1': '#bd174b',
  'brand-2': '#ceebb0',
  'brand-3': '#7fc8b0',
  'brand-4': '#64b39f',
  'brand-5': '#509992',
}

RGB Array

[189, 23, 75], [206, 235, 176], [127, 200, 176], [100, 179, 159], [80, 153, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #BD174B, #CEEBB0, #7FC8B0, #64B39F, #509992 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: #bd174b; --color-2: #ceebb0; --color-3: #7fc8b0; --color-4: #64b39f; --color-5: #509992. 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