#BDBDA5 + #C9D6C8 + #D3EDE5 + #A9F0F3 + #45E7FE · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BDBDA5

Fresh Green · Silver · Sunflower

HEX

#BDBDA5

RGB

rgb(189, 189, 165)

HSL

hsl(60, 15%, 69%)

HSB

hsb(60, 13%, 74%)

CMYK

cmyk(0%, 0%, 13%, 26%)

Oklch

oklch(79.2% 0.033 107.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#C9D6C8

Celadon · LightGray · Mint Green

HEX

#C9D6C8

RGB

rgb(201, 214, 200)

HSL

hsl(116, 15%, 81%)

HSB

hsb(116, 7%, 84%)

CMYK

cmyk(6%, 0%, 7%, 16%)

Oklch

oklch(86.2% 0.024 143.4)

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

#D3EDE5

Jade · Lavender · Glacier Blue

HEX

#D3EDE5

RGB

rgb(211, 237, 229)

HSL

hsl(162, 42%, 88%)

HSB

hsb(162, 11%, 93%)

CMYK

cmyk(11%, 0%, 3%, 7%)

Oklch

oklch(92.5% 0.029 175.2)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#A9F0F3

Sky Blue · LightBlue · Glacier Blue

HEX

#A9F0F3

RGB

rgb(169, 240, 243)

HSL

hsl(182, 76%, 81%)

HSB

hsb(182, 30%, 95%)

CMYK

cmyk(30%, 1%, 0%, 5%)

Oklch

oklch(90.9% 0.070 199.3)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#45E7FE

Sky Blue · Turquoise · Lake Green

HEX

#45E7FE

RGB

rgb(69, 231, 254)

HSL

hsl(187, 99%, 63%)

HSB

hsb(187, 73%, 100%)

CMYK

cmyk(73%, 9%, 0%, 0%)

Oklch

oklch(85.6% 0.132 209.0)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDBDA5

A4A4BC

Analogous

BCB0A4

BDBDA5

B0BCA4

Triadic

BDBDA5

A4BCBC

BCA4BC

Split-Comp.

BDBDA5

A4B0BC

B0A4BC

Tetradic

BDBDA5

A4BCB0

A4A4BC

BCA4B0

Contrast Matrix WCAG 2.1 Contrast

BDBDA5	C9D6C8	D3EDE5	A9F0F3	45E7FE
—	1.3 Fail	1.5 Fail	1.5 Fail	1.3 Fail
1.3 Fail	—	1.2 Fail	1.2 Fail	1.0 Fail
1.5 Fail	1.2 Fail	—	1.0 Fail	1.2 Fail
1.5 Fail	1.2 Fail	1.0 Fail	—	1.2 Fail
1.3 Fail	1.0 Fail	1.2 Fail	1.2 Fail	—

White BG

1.9Fail

1.5Fail

1.2Fail

1.3Fail

1.5Fail

Black BG

11.0AAA

13.9AAA

17.0AAA

16.4AAA

14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BDBDAB

CFCFCB

DEDEE7

C8C8F2

8B8DF8

Deuteranopia

BDBDAC

CECDCC

DDDBE7

C4BEF2

8276F7

Tritanopia

BDAFB0

CACECF

D4E8E9

ADF2F2

4DF4F3

Achromatopsia

BABABA

D1D1D1

E4E4E4

DBDBDB

B9B9B9

Shades & Tints Shades & Tints

#BDBDA5

Dark

Light

#C9D6C8

Dark

Light

#D3EDE5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdbda5;
  --color-2: #c9d6c8;
  --color-3: #d3ede5;
  --color-4: #a9f0f3;
  --color-5: #45e7fe;
}

SCSS

$color-1: #bdbda5;
$color-2: #c9d6c8;
$color-3: #d3ede5;
$color-4: #a9f0f3;
$color-5: #45e7fe;

TAILWIND

colors: {
  'brand-1': '#bdbda5',
  'brand-2': '#c9d6c8',
  'brand-3': '#d3ede5',
  'brand-4': '#a9f0f3',
  'brand-5': '#45e7fe',
}

RGB Array

[189, 189, 165], [201, 214, 200], [211, 237, 229], [169, 240, 243], [69, 231, 254]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #BDBDA5, #C9D6C8, #D3EDE5, #A9F0F3, #45E7FE is ideal for: health products, baby brands, fresh-style blogs. 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: #bdbda5; --color-2: #c9d6c8; --color-3: #d3ede5; --color-4: #a9f0f3; --color-5: #45e7fe. 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. 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