#7A8A6B + #FFE2B0 + #AFD0AC + #FF5959 + #CDDF93 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7A8A6B

Celadon · Gray · Olive Green

HEX

#7A8A6B

RGB

rgb(122, 138, 107)

HSL

hsl(91, 13%, 48%)

HSB

hsb(91, 22%, 54%)

CMYK

cmyk(12%, 0%, 22%, 46%)

Oklch

oklch(61.2% 0.049 130.0)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#FFE2B0

Goose Yellow · Wheat · Peach Orange

HEX

#FFE2B0

RGB

rgb(255, 226, 176)

HSL

hsl(38, 100%, 85%)

HSB

hsb(38, 31%, 100%)

CMYK

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

Oklch

oklch(92.5% 0.072 81.1)

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

#AFD0AC

Celadon · Silver · Apple Green

HEX

#AFD0AC

RGB

rgb(175, 208, 172)

HSL

hsl(115, 28%, 75%)

HSB

hsb(115, 17%, 82%)

CMYK

cmyk(16%, 0%, 17%, 18%)

Oklch

oklch(82.4% 0.061 142.8)

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

#FF5959

Peach Pink · Tomato · Coral Red

HEX

#FF5959

RGB

rgb(255, 89, 89)

HSL

hsl(0, 100%, 67%)

HSB

hsb(0, 65%, 100%)

CMYK

cmyk(0%, 65%, 65%, 0%)

Oklch

oklch(68.7% 0.202 24.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#CDDF93

Willow Green · Khaki · Apple Green

HEX

#CDDF93

RGB

rgb(205, 223, 147)

HSL

hsl(74, 54%, 73%)

HSB

hsb(74, 34%, 87%)

CMYK

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

Oklch

oklch(87.2% 0.100 119.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A8A6B

7B6A8A

Analogous

8A8A6A

7A8A6B

6A8A6B

Triadic

7A8A6B

6A7A8A

8A6A7A

Split-Comp.

7A8A6B

6B6A8A

8A6A8A

Tetradic

7A8A6B

6A8A8A

7B6A8A

8A6B6A

Contrast Matrix WCAG 2.1 Contrast

7A8A6B	FFE2B0	AFD0AC	FF5959	CDDF93
—	3.0 Fail	2.2 Fail	1.2 Fail	2.6 Fail
3.0 Fail	—	1.3 Fail	2.5 Fail	1.1 Fail
2.2 Fail	1.3 Fail	—	1.8 Fail	1.2 Fail
1.2 Fail	2.5 Fail	1.8 Fail	—	2.1 Fail
2.6 Fail	1.1 Fail	1.2 Fail	2.1 Fail	—

White BG

3.7AA Large

1.3Fail

1.7Fail

3.1AA Large

1.4Fail

Black BG

5.7AA

16.8AAA

12.4AAA

6.8AA

14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

818173

F2F2BC

BDBEB5

B7B659

D5D5A5

Deuteranopia

807F74

F4F6BF

BBB9B7

C1CD59

D4D2AA

Tritanopia

7B787A

FEC6C8

B1BCBD

F75959

CEB4B7

Achromatopsia

828282

E5E5E5

C2C2C2

8B8B8B

D1D1D1

Shades & Tints Shades & Tints

#7A8A6B

Dark

Light

#FFE2B0

Dark

Light

#AFD0AC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a8a6b;
  --color-2: #ffe2b0;
  --color-3: #afd0ac;
  --color-4: #ff5959;
  --color-5: #cddf93;
}

SCSS

$color-1: #7a8a6b;
$color-2: #ffe2b0;
$color-3: #afd0ac;
$color-4: #ff5959;
$color-5: #cddf93;

TAILWIND

colors: {
  'brand-1': '#7a8a6b',
  'brand-2': '#ffe2b0',
  'brand-3': '#afd0ac',
  'brand-4': '#ff5959',
  'brand-5': '#cddf93',
}

RGB Array

[122, 138, 107], [255, 226, 176], [175, 208, 172], [255, 89, 89], [205, 223, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A8A6B, #FFE2B0, #AFD0AC, #FF5959, #CDDF93 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: #7a8a6b; --color-2: #ffe2b0; --color-3: #afd0ac; --color-4: #ff5959; --color-5: #cddf93. 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