#AC9DE3 + #BEDBCD + #5FBFBB + #CACE9D + #FFF0D4 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#AC9DE3

Wisteria · LightSteelBlue · Cobalt Blue

HEX

#AC9DE3

RGB

rgb(172, 157, 227)

HSL

hsl(253, 56%, 75%)

HSB

hsb(253, 31%, 89%)

CMYK

cmyk(24%, 31%, 0%, 11%)

Oklch

oklch(73.5% 0.101 293.6)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#BEDBCD

Jade · LightGray · Apple Green

HEX

#BEDBCD

RGB

rgb(190, 219, 205)

HSL

hsl(151, 29%, 80%)

HSB

hsb(151, 13%, 86%)

CMYK

cmyk(13%, 0%, 6%, 14%)

Oklch

oklch(86.6% 0.036 164.9)

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

#5FBFBB

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#5FBFBB

RGB

rgb(95, 191, 187)

HSL

hsl(178, 43%, 56%)

HSB

hsb(178, 50%, 75%)

CMYK

cmyk(50%, 0%, 2%, 25%)

Oklch

oklch(74.6% 0.091 191.8)

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

#CACE9D

Fresh Green · Tan · Sunflower

HEX

#CACE9D

RGB

rgb(202, 206, 157)

HSL

hsl(65, 33%, 71%)

HSB

hsb(65, 24%, 81%)

CMYK

cmyk(2%, 0%, 24%, 19%)

Oklch

oklch(83.6% 0.065 111.6)

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

#FFF0D4

Goose Yellow · Beige · Peach Orange

HEX

#FFF0D4

RGB

rgb(255, 240, 212)

HSL

hsl(39, 100%, 92%)

HSB

hsb(39, 17%, 100%)

CMYK

cmyk(0%, 6%, 17%, 0%)

Oklch

oklch(96.0% 0.040 83.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AC9DE3

D3E39C

Analogous

9CB0E3

AC9DE3

CF9CE3

Triadic

AC9DE3

E3AB9C

9CE3AB

Split-Comp.

AC9DE3

E3CF9C

B0E39C

Tetradic

AC9DE3

E39CB0

D3E39C

9CE3CF

Contrast Matrix WCAG 2.1 Contrast

AC9DE3	BEDBCD	5FBFBB	CACE9D	FFF0D4
—	1.6 Fail	1.1 Fail	1.5 Fail	2.1 Fail
1.6 Fail	—	1.5 Fail	1.1 Fail	1.3 Fail
1.1 Fail	1.5 Fail	—	1.3 Fail	1.9 Fail
1.5 Fail	1.1 Fail	1.3 Fail	—	1.5 Fail
2.1 Fail	1.3 Fail	1.9 Fail	1.5 Fail	—

White BG

2.4Fail

1.5Fail

2.2Fail

1.6Fail

1.1Fail

Black BG

8.7AAA

14.2AAA

9.7AAA

12.8AAA

18.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A5D2

CBCBD0

8989BC

CCCCA9

F9F8DB

Deuteranopia

A6A8CE

C9C7D1

837CBC

CCCBAC

F9FBDC

Tritanopia

ABC5C2

BFD3D4

64BDBD

CAB2B4

FEE0E1

Achromatopsia

A9A9A9

D1D1D1

A2A2A2

C7C7C7

F1F1F1

Shades & Tints Shades & Tints

#AC9DE3

Dark

Light

#BEDBCD

Dark

Light

#5FBFBB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ac9de3;
  --color-2: #bedbcd;
  --color-3: #5fbfbb;
  --color-4: #cace9d;
  --color-5: #fff0d4;
}

SCSS

$color-1: #ac9de3;
$color-2: #bedbcd;
$color-3: #5fbfbb;
$color-4: #cace9d;
$color-5: #fff0d4;

TAILWIND

colors: {
  'brand-1': '#ac9de3',
  'brand-2': '#bedbcd',
  'brand-3': '#5fbfbb',
  'brand-4': '#cace9d',
  'brand-5': '#fff0d4',
}

RGB Array

[172, 157, 227], [190, 219, 205], [95, 191, 187], [202, 206, 157], [255, 240, 212]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #AC9DE3, #BEDBCD, #5FBFBB, #CACE9D, #FFF0D4 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: #ac9de3; --color-2: #bedbcd; --color-3: #5fbfbb; --color-4: #cace9d; --color-5: #fff0d4. 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