#7A7F92 + #6ACCBD + #9BEBBD + #D2E8B1 + #E4E8A9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7A7F92

Azure · SlateGray · Navy Blue

HEX

#7A7F92

RGB

rgb(122, 127, 146)

HSL

hsl(228, 10%, 53%)

HSB

hsb(228, 16%, 57%)

CMYK

cmyk(16%, 13%, 0%, 43%)

Oklch

oklch(59.9% 0.029 273.8)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#6ACCBD

Jade · MediumAquaMarine · Lake Green

HEX

#6ACCBD

RGB

rgb(106, 204, 189)

HSL

hsl(171, 49%, 61%)

HSB

hsb(171, 48%, 80%)

CMYK

cmyk(48%, 0%, 7%, 20%)

Oklch

oklch(78.1% 0.096 182.6)

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

#9BEBBD

Emerald · LightGreen · Apple Green

HEX

#9BEBBD

RGB

rgb(155, 235, 189)

HSL

hsl(146, 67%, 76%)

HSB

hsb(146, 34%, 92%)

CMYK

cmyk(34%, 0%, 20%, 8%)

Oklch

oklch(87.6% 0.102 158.2)

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

#D2E8B1

Willow Green · Wheat · Apple Green

HEX

#D2E8B1

RGB

rgb(210, 232, 177)

HSL

hsl(84, 54%, 80%)

HSB

hsb(84, 24%, 91%)

CMYK

cmyk(9%, 0%, 24%, 9%)

Oklch

oklch(90.1% 0.076 125.6)

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

#E4E8A9

Fresh Green · Wheat · Lemon Cream

HEX

#E4E8A9

RGB

rgb(228, 232, 169)

HSL

hsl(64, 58%, 79%)

HSB

hsb(64, 27%, 91%)

CMYK

cmyk(2%, 0%, 27%, 9%)

Oklch

oklch(91.3% 0.081 110.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A7F92

938E7B

Analogous

7B8C93

7A7F92

827B93

Triadic

7A7F92

937B80

80937B

Split-Comp.

7A7F92

93827B

8C937B

Tetradic

7A7F92

937B8C

938E7B

7B9382

Contrast Matrix WCAG 2.1 Contrast

7A7F92	6ACCBD	9BEBBD	D2E8B1	E4E8A9
—	2.1 Fail	2.8 Fail	3.0 AA Large	3.1 AA Large
2.1 Fail	—	1.4 Fail	1.4 Fail	1.5 Fail
2.8 Fail	1.4 Fail	—	1.1 Fail	1.1 Fail
3.0 AA Large	1.4 Fail	1.1 Fail	—	1.0 Fail
3.1 AA Large	1.5 Fail	1.1 Fail	1.0 Fail	—

White BG

4.0AA Large

1.9Fail

1.4Fail

1.3Fail

Black BG

5.3AA

11.0AAA

15.0AAA

15.9AAA

16.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7C8D

9495C1

BEBEC8

DCDCBE

E6E6B8

Deuteranopia

7C7C8C

8F87C1

B9B3CB

DAD9C2

E6E5BC

Tritanopia

7A8A89

6FC3C4

9FD1D3

D3C9CB

E4C4C7

Achromatopsia

808080

ADADAD

CECECE

DBDBDB

E0E0E0

Shades & Tints Shades & Tints

#7A7F92

Dark

Light

#6ACCBD

Dark

Light

#9BEBBD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a7f92;
  --color-2: #6accbd;
  --color-3: #9bebbd;
  --color-4: #d2e8b1;
  --color-5: #e4e8a9;
}

SCSS

$color-1: #7a7f92;
$color-2: #6accbd;
$color-3: #9bebbd;
$color-4: #d2e8b1;
$color-5: #e4e8a9;

TAILWIND

colors: {
  'brand-1': '#7a7f92',
  'brand-2': '#6accbd',
  'brand-3': '#9bebbd',
  'brand-4': '#d2e8b1',
  'brand-5': '#e4e8a9',
}

RGB Array

[122, 127, 146], [106, 204, 189], [155, 235, 189], [210, 232, 177], [228, 232, 169]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A7F92, #6ACCBD, #9BEBBD, #D2E8B1, #E4E8A9 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: #7a7f92; --color-2: #6accbd; --color-3: #9bebbd; --color-4: #d2e8b1; --color-5: #e4e8a9. 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