← Back to Editor

#FFFD73 · #A1F2A5 · #41DDCF · #457AC0 · #00122E

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

#FFFD73

Fresh Green · Khaki · Sunflower

HEX
#FFFD73
RGB
rgb(255, 253, 115)
HSL
hsl(59, 100%, 73%)
HSB
hsb(59, 55%, 100%)
CMYK
cmyk(0%, 1%, 55%, 0%)
Oklch
oklch(96.9% 0.159 108.3)

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

#A1F2A5

Emerald · LightGreen · Apple Green

HEX
#A1F2A5
RGB
rgb(161, 242, 165)
HSL
hsl(123, 76%, 79%)
HSB
hsb(123, 33%, 95%)
CMYK
cmyk(33%, 0%, 32%, 5%)
Oklch
oklch(89.0% 0.131 145.5)

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

#41DDCF

Mineral Blue · Turquoise · Lake Green

HEX
#41DDCF
RGB
rgb(65, 221, 207)
HSL
hsl(175, 70%, 56%)
HSB
hsb(175, 71%, 87%)
CMYK
cmyk(71%, 0%, 6%, 13%)
Oklch
oklch(81.5% 0.128 186.1)

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

#457AC0

Azure · SteelBlue · Navy Blue

HEX
#457AC0
RGB
rgb(69, 122, 192)
HSL
hsl(214, 49%, 51%)
HSB
hsb(214, 64%, 75%)
CMYK
cmyk(64%, 36%, 0%, 25%)
Oklch
oklch(57.6% 0.123 256.0)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#00122E

Indigo · Black · Deep Sea Blue

HEX
#00122E
RGB
rgb(0, 18, 46)
HSL
hsl(217, 100%, 9%)
HSB
hsb(217, 100%, 18%)
CMYK
cmyk(100%, 61%, 0%, 82%)
Oklch
oklch(18.6% 0.063 255.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFD73
7578FF

Analogous

FFB875
FFFD73
BCFF75

Triadic

FFFD73
75FFFD
FD75FF

Split-Comp.

FFFD73
75BCFF
B875FF

Tetradic

FFFD73
75FFB8
7578FF
FF75BC

Contrast Matrix WCAG 2.1 Contrast

FFFD73
A1F2A5
41DDCF
457AC0
00122E
—
1.2
Fail
1.6
Fail
4.1
AA Large
17.4
AAA
1.2
Fail
—
1.3
Fail
3.3
AA Large
14.0
AAA
1.6
Fail
1.3
Fail
—
2.6
Fail
11.1
AAA
4.1
AA Large
3.3
AA Large
2.6
Fail
—
4.3
AA Large
17.4
AAA
14.0
AAA
11.1
AAA
4.3
AA Large
—
White BG
1.1Fail
1.3Fail
1.7Fail
4.4AA Large
18.7AAA
Black BG
19.5AAA
15.8AAA
12.5AAA
4.8AA
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FEFE94
C4C5B8
8586D2
5C5CAF
080827

Deuteranopia

FEFE9C
BFB9BC
7C70D3
5955AB
070526

Tritanopia

FFAFB5
A5C6CA
49D5D6
48A29F
012221

Achromatopsia

EEEEEE
D1D1D1
ADADAD
727272
101010

Shades & Tints Shades & Tints

#FFFD73

Dark
Light

#A1F2A5

Dark
Light

#41DDCF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffd73;
  --color-2: #a1f2a5;
  --color-3: #41ddcf;
  --color-4: #457ac0;
  --color-5: #00122e;
}

SCSS

$color-1: #fffd73;
$color-2: #a1f2a5;
$color-3: #41ddcf;
$color-4: #457ac0;
$color-5: #00122e;

TAILWIND

colors: {
  'brand-1': '#fffd73',
  'brand-2': '#a1f2a5',
  'brand-3': '#41ddcf',
  'brand-4': '#457ac0',
  'brand-5': '#00122e',
}

RGB Array

[255, 253, 115], [161, 242, 165], [65, 221, 207], [69, 122, 192], [0, 18, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFD73, #A1F2A5, #41DDCF, #457AC0, #00122E 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: #fffd73; --color-2: #a1f2a5; --color-3: #41ddcf; --color-4: #457ac0; --color-5: #00122e. 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