#669999 + #85B299 + #A4CC99 + #C4E699 + #E3FF99 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#669999

Slate Blue · CadetBlue · Mint Ice

HEX

#669999

RGB

rgb(102, 153, 153)

HSL

hsl(180, 20%, 50%)

HSB

hsb(180, 33%, 60%)

CMYK

cmyk(33%, 0%, 0%, 40%)

Oklch

oklch(64.7% 0.054 195.9)

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

#85B299

Celadon · DarkSeaGreen · Apple Green

HEX

#85B299

RGB

rgb(133, 178, 153)

HSL

hsl(147, 23%, 61%)

HSB

hsb(147, 25%, 70%)

CMYK

cmyk(25%, 0%, 14%, 30%)

Oklch

oklch(72.4% 0.060 160.1)

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

#A4CC99

Celadon · DarkSeaGreen · Apple Green

HEX

#A4CC99

RGB

rgb(164, 204, 153)

HSL

hsl(107, 33%, 70%)

HSB

hsb(107, 25%, 80%)

CMYK

cmyk(20%, 0%, 25%, 20%)

Oklch

oklch(80.3% 0.082 139.0)

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

#C4E699

Willow Green · Khaki · Apple Green

HEX

#C4E699

RGB

rgb(196, 230, 153)

HSL

hsl(86, 61%, 75%)

HSB

hsb(86, 33%, 90%)

CMYK

cmyk(15%, 0%, 33%, 10%)

Oklch

oklch(88.2% 0.107 127.8)

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

#E3FF99

Willow Green · Khaki · Apple Green

HEX

#E3FF99

RGB

rgb(227, 255, 153)

HSL

hsl(76, 100%, 80%)

HSB

hsb(76, 40%, 100%)

CMYK

cmyk(11%, 0%, 40%, 0%)

Oklch

oklch(95.7% 0.131 121.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

669999

996666

Analogous

669980

669999

668099

Triadic

669999

996699

999966

Split-Comp.

669999

996680

998066

Tetradic

669999

806699

996666

809966

Contrast Matrix WCAG 2.1 Contrast

669999	85B299	A4CC99	C4E699	E3FF99
—	1.3 Fail	1.8 Fail	2.3 Fail	2.9 Fail
1.3 Fail	—	1.3 Fail	1.7 Fail	2.2 Fail
1.8 Fail	1.3 Fail	—	1.3 Fail	1.6 Fail
2.3 Fail	1.7 Fail	1.3 Fail	—	1.3 Fail
2.9 Fail	2.2 Fail	1.6 Fail	1.3 Fail	—

White BG

3.2AA Large

2.4Fail

1.8Fail

1.4Fail

1.1Fail

Black BG

6.6AA

8.8AAA

11.7AAA

15.1AAA

19.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7D99

98999F

B5B6A5

D3D3AC

EFEFB2

Deuteranopia

797599

9693A1

B3B0A8

D1CEB0

EEEBB8

Tritanopia

699999

87A4A5

A6AFB1

C6BABE

E4C5C9

Achromatopsia

8A8A8A

A2A2A2

BABABA

D3D3D3

EBEBEB

Shades & Tints Shades & Tints

#669999

Dark

Light

#85B299

Dark

Light

#A4CC99

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #669999;
  --color-2: #85b299;
  --color-3: #a4cc99;
  --color-4: #c4e699;
  --color-5: #e3ff99;
}

SCSS

$color-1: #669999;
$color-2: #85b299;
$color-3: #a4cc99;
$color-4: #c4e699;
$color-5: #e3ff99;

TAILWIND

colors: {
  'brand-1': '#669999',
  'brand-2': '#85b299',
  'brand-3': '#a4cc99',
  'brand-4': '#c4e699',
  'brand-5': '#e3ff99',
}

RGB Array

[102, 153, 153], [133, 178, 153], [164, 204, 153], [196, 230, 153], [227, 255, 153]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #669999, #85B299, #A4CC99, #C4E699, #E3FF99 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: #669999; --color-2: #85b299; --color-3: #a4cc99; --color-4: #c4e699; --color-5: #e3ff99. 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 bright-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