← Back to Editor

#ABDEB3 · #E3EBB7 · #FF4974 · #360C2E · #D3DF97

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#ABDEB3

Celadon · Silver · Apple Green

HEX
#ABDEB3
RGB
rgb(171, 222, 179)
HSL
hsl(129, 44%, 77%)
HSB
hsb(129, 23%, 87%)
CMYK
cmyk(23%, 0%, 19%, 13%)
Oklch
oklch(85.4% 0.079 149.2)

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

#E3EBB7

Fresh Green · Wheat · Lemon Cream

HEX
#E3EBB7
RGB
rgb(227, 235, 183)
HSL
hsl(69, 57%, 82%)
HSB
hsb(69, 22%, 92%)
CMYK
cmyk(3%, 0%, 22%, 8%)
Oklch
oklch(92.1% 0.068 114.9)

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

#FF4974

Peach Pink · Tomato · Coral Red

HEX
#FF4974
RGB
rgb(255, 73, 116)
HSL
hsl(346, 100%, 64%)
HSB
hsb(346, 71%, 100%)
CMYK
cmyk(0%, 71%, 55%, 0%)
Oklch
oklch(67.6% 0.217 11.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#360C2E

Rose Purple · Black · Dark Purple

HEX
#360C2E
RGB
rgb(54, 12, 46)
HSL
hsl(311, 64%, 13%)
HSB
hsb(311, 78%, 21%)
CMYK
cmyk(0%, 78%, 15%, 79%)
Oklch
oklch(24.2% 0.081 336.3)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#D3DF97

Willow Green · Khaki · Apple Green

HEX
#D3DF97
RGB
rgb(211, 223, 151)
HSL
hsl(70, 53%, 73%)
HSB
hsb(70, 32%, 87%)
CMYK
cmyk(5%, 0%, 32%, 13%)
Oklch
oklch(87.8% 0.094 116.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABDEB3
DEABD6

Analogous

BDDEAB
ABDEB3
ABDECC

Triadic

ABDEB3
B2ABDE
DEB2AB

Split-Comp.

ABDEB3
CCABDE
DEABBD

Tetradic

ABDEB3
ABBDDE
DEABD6
DECCAB

Contrast Matrix WCAG 2.1 Contrast

ABDEB3
E3EBB7
FF4974
360C2E
D3DF97
—
1.2
Fail
2.1
Fail
11.1
AAA
1.1
Fail
1.2
Fail
—
2.6
Fail
13.5
AAA
1.1
Fail
2.1
Fail
2.6
Fail
—
5.2
AA
2.3
Fail
11.1
AAA
13.5
AAA
5.2
AA
—
11.8
AAA
1.1
Fail
1.1
Fail
2.3
Fail
11.8
AAA
—
White BG
1.5Fail
1.2Fail
3.3AA Large
16.8AAA
1.4Fail
Black BG
13.8AAA
16.8AAA
6.5AA
1.2Fail
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C2BD
E6E7C4
B0AF6A
242326
D8D8A8

Deuteranopia

BEBAC0
E6E5C7
BBC867
262924
D8D7AD

Tritanopia

AEC6C7
E3CED0
F66160
341F1E
D4B6B9

Achromatopsia

CACACA
E3E3E3
848484
1C1C1C
D3D3D3

Shades & Tints Shades & Tints

#ABDEB3

Dark
Light

#E3EBB7

Dark
Light

#FF4974

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #abdeb3;
  --color-2: #e3ebb7;
  --color-3: #ff4974;
  --color-4: #360c2e;
  --color-5: #d3df97;
}

SCSS

$color-1: #abdeb3;
$color-2: #e3ebb7;
$color-3: #ff4974;
$color-4: #360c2e;
$color-5: #d3df97;

TAILWIND

colors: {
  'brand-1': '#abdeb3',
  'brand-2': '#e3ebb7',
  'brand-3': '#ff4974',
  'brand-4': '#360c2e',
  'brand-5': '#d3df97',
}

RGB Array

[171, 222, 179], [227, 235, 183], [255, 73, 116], [54, 12, 46], [211, 223, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ABDEB3, #E3EBB7, #FF4974, #360C2E, #D3DF97 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #abdeb3; --color-2: #e3ebb7; --color-3: #ff4974; --color-4: #360c2e; --color-5: #d3df97. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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