#61A7A7 + #99C9BD + #CEDBC7 + #FBEAD8 + #FF6891 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#61A7A7

Slate Blue · CadetBlue · Lake Green

HEX

#61A7A7

RGB

rgb(97, 167, 167)

HSL

hsl(180, 28%, 52%)

HSB

hsb(180, 42%, 65%)

CMYK

cmyk(42%, 0%, 0%, 35%)

Oklch

oklch(68.3% 0.071 195.6)

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

#99C9BD

Jade · Silver · Lake Green

HEX

#99C9BD

RGB

rgb(153, 201, 189)

HSL

hsl(165, 31%, 69%)

HSB

hsb(165, 24%, 79%)

CMYK

cmyk(24%, 0%, 6%, 21%)

Oklch

oklch(79.9% 0.053 177.8)

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

#CEDBC7

Celadon · LightGray · Mint Green

HEX

#CEDBC7

RGB

rgb(206, 219, 199)

HSL

hsl(99, 22%, 82%)

HSB

hsb(99, 9%, 86%)

CMYK

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

Oklch

oklch(87.6% 0.030 134.4)

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

#FBEAD8

Goose Yellow · Beige · Peach Orange

HEX

#FBEAD8

RGB

rgb(251, 234, 216)

HSL

hsl(31, 81%, 92%)

HSB

hsb(31, 14%, 98%)

CMYK

cmyk(0%, 7%, 14%, 2%)

Oklch

oklch(94.6% 0.030 69.0)

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

#FF6891

Rouge · LightCoral · Rose Pink

HEX

#FF6891

RGB

rgb(255, 104, 145)

HSL

hsl(344, 100%, 70%)

HSB

hsb(344, 59%, 100%)

CMYK

cmyk(0%, 59%, 43%, 0%)

Oklch

oklch(71.6% 0.186 6.3)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

61A7A7

A76262

Analogous

62A785

61A7A7

6285A7

Triadic

61A7A7

A762A7

A7A762

Split-Comp.

61A7A7

A76285

A78562

Tetradic

61A7A7

8562A7

A76262

85A762

Contrast Matrix WCAG 2.1 Contrast

61A7A7	99C9BD	CEDBC7	FBEAD8	FF6891
—	1.5 Fail	1.9 Fail	2.4 Fail	1.0 Fail
1.5 Fail	—	1.3 Fail	1.6 Fail	1.5 Fail
1.9 Fail	1.3 Fail	—	1.2 Fail	1.9 Fail
2.4 Fail	1.6 Fail	1.2 Fail	—	2.3 Fail
1.0 Fail	1.5 Fail	1.9 Fail	2.3 Fail	—

White BG

2.8Fail

1.8Fail

1.4Fail

1.2Fail

2.7Fail

Black BG

7.6AAA

11.4AAA

14.6AAA

17.9AAA

7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F80A7

AEAEC0

D4D4CC

F4F3DC

BEBC87

Deuteranopia

7B76A7

ABA7C1

D3D2CD

F5F6DD

C6D285

Tritanopia

64A7A7

9BC2C3

CFD0D1

FAE0E1

F77F7E

Achromatopsia

929292

B9B9B9

D5D5D5

EDEDED

9A9A9A

Shades & Tints Shades & Tints

#61A7A7

Dark

Light

#99C9BD

Dark

Light

#CEDBC7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #61a7a7;
  --color-2: #99c9bd;
  --color-3: #cedbc7;
  --color-4: #fbead8;
  --color-5: #ff6891;
}

SCSS

$color-1: #61a7a7;
$color-2: #99c9bd;
$color-3: #cedbc7;
$color-4: #fbead8;
$color-5: #ff6891;

TAILWIND

colors: {
  'brand-1': '#61a7a7',
  'brand-2': '#99c9bd',
  'brand-3': '#cedbc7',
  'brand-4': '#fbead8',
  'brand-5': '#ff6891',
}

RGB Array

[97, 167, 167], [153, 201, 189], [206, 219, 199], [251, 234, 216], [255, 104, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #61A7A7, #99C9BD, #CEDBC7, #FBEAD8, #FF6891 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: #61a7a7; --color-2: #99c9bd; --color-3: #cedbc7; --color-4: #fbead8; --color-5: #ff6891. 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 general-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