← Back to Editor

#BFE3DE · #C4DE00 · #061702 · #FA2807 · #F0DEB4

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 AppData Visualization

Color Details Color Details

#BFE3DE

Jade · LightBlue · Glacier Blue

HEX
#BFE3DE
RGB
rgb(191, 227, 222)
HSL
hsl(172, 39%, 82%)
HSB
hsb(172, 16%, 89%)
CMYK
cmyk(16%, 0%, 2%, 11%)
Oklch
oklch(88.9% 0.038 186.3)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#C4DE00

Autumn Sage · Gold · Honey Gold

HEX
#C4DE00
RGB
rgb(196, 222, 0)
HSL
hsl(67, 100%, 44%)
HSB
hsb(67, 100%, 87%)
CMYK
cmyk(12%, 0%, 100%, 13%)
Oklch
oklch(85.1% 0.198 117.9)

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

#061702

Pine Green · Black · Dark Green

HEX
#061702
RGB
rgb(6, 23, 2)
HSL
hsl(109, 84%, 5%)
HSB
hsb(109, 91%, 9%)
CMYK
cmyk(74%, 0%, 91%, 91%)
Oklch
oklch(18.3% 0.049 138.3)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

#FA2807

Vermilion · OrangeRed · Passion Red

HEX
#FA2807
RGB
rgb(250, 40, 7)
HSL
hsl(8, 96%, 50%)
HSB
hsb(8, 97%, 98%)
CMYK
cmyk(0%, 84%, 97%, 2%)
Oklch
oklch(63.1% 0.242 31.1)

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

#F0DEB4

Goose Yellow · Wheat · Lemon Cream

HEX
#F0DEB4
RGB
rgb(240, 222, 180)
HSL
hsl(42, 67%, 82%)
HSB
hsb(42, 25%, 94%)
CMYK
cmyk(0%, 7%, 25%, 6%)
Oklch
oklch(90.5% 0.058 87.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFE3DE
E3BFC4

Analogous

BFE3CC
BFE3DE
BFD6E3

Triadic

BFE3DE
DEBFE3
E3DEBF

Split-Comp.

BFE3DE
E3BFD6
E3CCBF

Tetradic

BFE3DE
CCBFE3
E3BFC4
D6E3BF

Contrast Matrix WCAG 2.1 Contrast

BFE3DE
C4DE00
061702
FA2807
F0DEB4
—
1.1
Fail
13.5
AAA
2.8
Fail
1.0
Fail
1.1
Fail
—
12.2
AAA
2.6
Fail
1.1
Fail
13.5
AAA
12.2
AAA
—
4.7
AA
14.0
AAA
2.8
Fail
2.6
Fail
4.7
AA
—
2.9
Fail
1.0
Fail
1.1
Fail
14.0
AAA
2.9
Fail
—
White BG
1.4Fail
1.5Fail
18.6AAA
3.9AA Large
1.3Fail
Black BG
15.3AAA
13.8AAA
1.1Fail
5.4AA
15.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCFDF
CFCF36
0D0E07
9F9D0F
E8E8BE

Deuteranopia

CDCADF
CECC43
0C0B08
ABBB11
E9EBC1

Tritanopia

C1E0E0
C56069
070B0C
F01517
EFC6C8

Achromatopsia

D8D8D8
BDBDBD
101010
636363
DFDFDF

Shades & Tints Shades & Tints

#BFE3DE

Dark
Light

#C4DE00

Dark
Light

#061702

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfe3de;
  --color-2: #c4de00;
  --color-3: #061702;
  --color-4: #fa2807;
  --color-5: #f0deb4;
}

SCSS

$color-1: #bfe3de;
$color-2: #c4de00;
$color-3: #061702;
$color-4: #fa2807;
$color-5: #f0deb4;

TAILWIND

colors: {
  'brand-1': '#bfe3de',
  'brand-2': '#c4de00',
  'brand-3': '#061702',
  'brand-4': '#fa2807',
  'brand-5': '#f0deb4',
}

RGB Array

[191, 227, 222], [196, 222, 0], [6, 23, 2], [250, 40, 7], [240, 222, 180]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFE3DE, #C4DE00, #061702, #FA2807, #F0DEB4 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: #bfe3de; --color-2: #c4de00; --color-3: #061702; --color-4: #fa2807; --color-5: #f0deb4. 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