← Back to Editor

#FCF71E · #070016 · #7FE3CC · #ADE0D4 · #CAEBE3

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

#FCF71E

Autumn Sage · Yellow · Sunflower

HEX
#FCF71E
RGB
rgb(252, 247, 30)
HSL
hsl(59, 97%, 55%)
HSB
hsb(59, 88%, 99%)
CMYK
cmyk(0%, 2%, 88%, 1%)
Oklch
oklch(94.9% 0.201 108.2)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#070016

Deep Indigo · Black · Deep Sea Blue

HEX
#070016
RGB
rgb(7, 0, 22)
HSL
hsl(259, 100%, 4%)
HSB
hsb(259, 100%, 9%)
CMYK
cmyk(68%, 100%, 0%, 91%)
Oklch
oklch(10.9% 0.059 298.0)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#7FE3CC

Jade · SkyBlue · Lake Green

HEX
#7FE3CC
RGB
rgb(127, 227, 204)
HSL
hsl(166, 64%, 69%)
HSB
hsb(166, 44%, 89%)
CMYK
cmyk(44%, 0%, 10%, 11%)
Oklch
oklch(84.8% 0.100 177.1)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#ADE0D4

Jade · LightBlue · Glacier Blue

HEX
#ADE0D4
RGB
rgb(173, 224, 212)
HSL
hsl(166, 45%, 78%)
HSB
hsb(166, 23%, 88%)
CMYK
cmyk(23%, 0%, 5%, 12%)
Oklch
oklch(86.8% 0.055 178.9)

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

#CAEBE3

Jade · LightGray · Glacier Blue

HEX
#CAEBE3
RGB
rgb(202, 235, 227)
HSL
hsl(165, 45%, 86%)
HSB
hsb(165, 14%, 92%)
CMYK
cmyk(14%, 0%, 3%, 8%)
Oklch
oklch(91.4% 0.036 179.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCF71E
1D21FC

Analogous

FC891D
FCF71E
90FC1D

Triadic

FCF71E
1DFCF8
F81DFC

Split-Comp.

FCF71E
1D90FC
891DFC

Tetradic

FCF71E
1DFC89
1D21FC
FC1D90

Contrast Matrix WCAG 2.1 Contrast

FCF71E
070016
7FE3CC
ADE0D4
CAEBE3
—
18.1
AAA
1.3
Fail
1.3
Fail
1.1
Fail
18.1
AAA
—
13.5
AAA
14.1
AAA
16.2
AAA
1.3
Fail
13.5
AAA
—
1.0
Fail
1.2
Fail
1.3
Fail
14.1
AAA
1.0
Fail
—
1.1
Fail
1.1
Fail
16.2
AAA
1.2
Fail
1.1
Fail
—
White BG
1.1Fail
20.6AAA
1.5Fail
1.5Fail
1.3Fail
Black BG
18.5AAA
1.0Fail
13.8AAA
14.4AAA
16.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFA53
040411
AAABD2
C3C4D7
D8D9E5

Deuteranopia

FAFA5F
04050F
A59DD3
C0BCD8
D6D4E5

Tritanopia

FC7C85
070C0C
84D6D7
B0D9DA
CCE6E7

Achromatopsia

E0E0E0
050505
C2C2C2
CFCFCF
E0E0E0

Shades & Tints Shades & Tints

#FCF71E

Dark
Light

#070016

Dark
Light

#7FE3CC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcf71e;
  --color-2: #070016;
  --color-3: #7fe3cc;
  --color-4: #ade0d4;
  --color-5: #caebe3;
}

SCSS

$color-1: #fcf71e;
$color-2: #070016;
$color-3: #7fe3cc;
$color-4: #ade0d4;
$color-5: #caebe3;

TAILWIND

colors: {
  'brand-1': '#fcf71e',
  'brand-2': '#070016',
  'brand-3': '#7fe3cc',
  'brand-4': '#ade0d4',
  'brand-5': '#caebe3',
}

RGB Array

[252, 247, 30], [7, 0, 22], [127, 227, 204], [173, 224, 212], [202, 235, 227]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCF71E, #070016, #7FE3CC, #ADE0D4, #CAEBE3 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: #fcf71e; --color-2: #070016; --color-3: #7fe3cc; --color-4: #ade0d4; --color-5: #caebe3. 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