← Back to Editor

#63C69A · #F4CE47 · #FF1E2D · #AFE19A · #E1E78D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#63C69A

Mineral Blue · MediumAquaMarine · Olive Green

HEX
#63C69A
RGB
rgb(99, 198, 154)
HSL
hsl(153, 46%, 58%)
HSB
hsb(153, 50%, 78%)
CMYK
cmyk(50%, 0%, 22%, 22%)
Oklch
oklch(75.4% 0.114 162.7)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#F4CE47

Ginger · SandyBrown · Sunflower

HEX
#F4CE47
RGB
rgb(244, 206, 71)
HSL
hsl(47, 89%, 62%)
HSB
hsb(47, 71%, 96%)
CMYK
cmyk(0%, 16%, 71%, 4%)
Oklch
oklch(86.1% 0.153 92.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#FF1E2D

Vermilion · Crimson · Passion Red

HEX
#FF1E2D
RGB
rgb(255, 30, 45)
HSL
hsl(356, 100%, 56%)
HSB
hsb(356, 88%, 100%)
CMYK
cmyk(0%, 88%, 82%, 0%)
Oklch
oklch(63.7% 0.248 26.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#AFE19A

Emerald · LightGreen · Apple Green

HEX
#AFE19A
RGB
rgb(175, 225, 154)
HSL
hsl(102, 54%, 74%)
HSB
hsb(102, 32%, 88%)
CMYK
cmyk(22%, 0%, 32%, 12%)
Oklch
oklch(85.7% 0.108 136.7)

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

#E1E78D

Fresh Green · Khaki · Sunflower

HEX
#E1E78D
RGB
rgb(225, 231, 141)
HSL
hsl(64, 65%, 73%)
HSB
hsb(64, 39%, 91%)
CMYK
cmyk(3%, 0%, 39%, 9%)
Oklch
oklch(90.4% 0.113 111.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

63C69A
C5638F

Analogous

63C568
63C69A
63C0C5

Triadic

63C69A
9963C5
C59963

Split-Comp.

63C69A
C563C0
C56863

Tetradic

63C69A
6863C5
C5638F
C0C563

Contrast Matrix WCAG 2.1 Contrast

63C69A
F4CE47
FF1E2D
AFE19A
E1E78D
—
1.4
Fail
1.8
Fail
1.4
Fail
1.6
Fail
1.4
Fail
—
2.5
Fail
1.0
Fail
1.2
Fail
1.8
Fail
2.5
Fail
—
2.6
Fail
2.9
Fail
1.4
Fail
1.0
Fail
2.6
Fail
—
1.1
Fail
1.6
Fail
1.2
Fail
2.9
Fail
1.1
Fail
—
White BG
2.1Fail
1.5Fail
3.8AA Large
1.5Fail
1.3Fail
Black BG
10.1AAA
13.8AAA
5.5AA
14.1AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8FA5
E4E368
9E9C29
C5C5AB
E4E4A3

Deuteranopia

8881A7
E6E970
ABBC29
C2BEAF
E3E3A8

Tritanopia

68ADAF
F28187
F42726
B2B9BC
E1B4B8

Achromatopsia

A3A3A3
CACACA
636363
CACACA
DBDBDB

Shades & Tints Shades & Tints

#63C69A

Dark
Light

#F4CE47

Dark
Light

#FF1E2D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #63c69a;
  --color-2: #f4ce47;
  --color-3: #ff1e2d;
  --color-4: #afe19a;
  --color-5: #e1e78d;
}

SCSS

$color-1: #63c69a;
$color-2: #f4ce47;
$color-3: #ff1e2d;
$color-4: #afe19a;
$color-5: #e1e78d;

TAILWIND

colors: {
  'brand-1': '#63c69a',
  'brand-2': '#f4ce47',
  'brand-3': '#ff1e2d',
  'brand-4': '#afe19a',
  'brand-5': '#e1e78d',
}

RGB Array

[99, 198, 154], [244, 206, 71], [255, 30, 45], [175, 225, 154], [225, 231, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #63C69A, #F4CE47, #FF1E2D, #AFE19A, #E1E78D is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #63c69a; --color-2: #f4ce47; --color-3: #ff1e2d; --color-4: #afe19a; --color-5: #e1e78d. 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. 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