← Back to Editor

#644D20 · #F55A0A · #C1CF1B · #DBF44C · #86CC8D

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 App

Color Details Color Details

#644D20

Ochre · DarkOliveGreen · Honey Gold

HEX
#644D20
RGB
rgb(100, 77, 32)
HSL
hsl(40, 52%, 26%)
HSB
hsb(40, 68%, 39%)
CMYK
cmyk(0%, 23%, 68%, 61%)
Oklch
oklch(43.5% 0.069 81.9)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#F55A0A

Tangerine · OrangeRed · Amber Brown

HEX
#F55A0A
RGB
rgb(245, 90, 10)
HSL
hsl(20, 92%, 50%)
HSB
hsb(20, 96%, 96%)
CMYK
cmyk(0%, 63%, 96%, 4%)
Oklch
oklch(66.6% 0.203 40.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#C1CF1B

Autumn Sage · GoldenRod · Honey Gold

HEX
#C1CF1B
RGB
rgb(193, 207, 27)
HSL
hsl(65, 77%, 46%)
HSB
hsb(65, 87%, 81%)
CMYK
cmyk(7%, 0%, 87%, 19%)
Oklch
oklch(81.6% 0.179 114.7)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#DBF44C

Fresh Green · GreenYellow · Sunflower

HEX
#DBF44C
RGB
rgb(219, 244, 76)
HSL
hsl(69, 88%, 63%)
HSB
hsb(69, 69%, 96%)
CMYK
cmyk(10%, 0%, 69%, 4%)
Oklch
oklch(91.9% 0.187 117.6)

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

#86CC8D

Celadon · DarkSeaGreen · Apple Green

HEX
#86CC8D
RGB
rgb(134, 204, 141)
HSL
hsl(126, 41%, 66%)
HSB
hsb(126, 34%, 80%)
CMYK
cmyk(34%, 0%, 31%, 20%)
Oklch
oklch(78.2% 0.113 146.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

644D20
203765

Analogous

652B20
644D20
596520

Triadic

644D20
20654E
4E2065

Split-Comp.

644D20
205965
2B2065

Tetradic

644D20
20652B
203765
652059

Contrast Matrix WCAG 2.1 Contrast

644D20
F55A0A
C1CF1B
DBF44C
86CC8D
—
2.4
Fail
4.7
AA
6.5
AA
4.2
AA Large
2.4
Fail
—
1.9
Fail
2.7
Fail
1.7
Fail
4.7
AA
1.9
Fail
—
1.4
Fail
1.1
Fail
6.5
AA
2.7
Fail
1.4
Fail
—
1.5
Fail
4.2
AA Large
1.7
Fail
1.1
Fail
1.5
Fail
—
White BG
8.0AAA
3.3AA Large
1.7Fail
1.2Fail
1.9Fail
Black BG
2.6Fail
6.3AA
12.2AAA
17.1AAA
11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5A2B
B2B01D
C7C747
E6E675
A4A59C

Deuteranopia

5B5D2E
BBC722
C6C551
E4E37E
A09BA0

Tritanopia

633335
ED2D30
C26970
DC959C
8AA8AB

Achromatopsia

4F4F4F
7F7F7F
B6B6B6
D9D9D9
B0B0B0

Shades & Tints Shades & Tints

#644D20

Dark
Light

#F55A0A

Dark
Light

#C1CF1B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #644d20;
  --color-2: #f55a0a;
  --color-3: #c1cf1b;
  --color-4: #dbf44c;
  --color-5: #86cc8d;
}

SCSS

$color-1: #644d20;
$color-2: #f55a0a;
$color-3: #c1cf1b;
$color-4: #dbf44c;
$color-5: #86cc8d;

TAILWIND

colors: {
  'brand-1': '#644d20',
  'brand-2': '#f55a0a',
  'brand-3': '#c1cf1b',
  'brand-4': '#dbf44c',
  'brand-5': '#86cc8d',
}

RGB Array

[100, 77, 32], [245, 90, 10], [193, 207, 27], [219, 244, 76], [134, 204, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #644D20, #F55A0A, #C1CF1B, #DBF44C, #86CC8D 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: #644d20; --color-2: #f55a0a; --color-3: #c1cf1b; --color-4: #dbf44c; --color-5: #86cc8d. 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