← Back to Editor

#FFFD8A · #A0C46A · #549C86 · #3D6A70 · #262442

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FFFD8A

Fresh Green · Khaki · Lemon Cream

HEX
#FFFD8A
RGB
rgb(255, 253, 138)
HSL
hsl(59, 100%, 77%)
HSB
hsb(59, 46%, 100%)
CMYK
cmyk(0%, 1%, 46%, 0%)
Oklch
oklch(97.2% 0.138 107.8)

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

#A0C46A

Grass Green · DarkSeaGreen · Olive Green

HEX
#A0C46A
RGB
rgb(160, 196, 106)
HSL
hsl(84, 43%, 59%)
HSB
hsb(84, 46%, 77%)
CMYK
cmyk(18%, 0%, 46%, 23%)
Oklch
oklch(77.4% 0.124 127.0)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#549C86

Mineral Blue · CadetBlue · Mint Ice

HEX
#549C86
RGB
rgb(84, 156, 134)
HSL
hsl(162, 30%, 47%)
HSB
hsb(162, 46%, 61%)
CMYK
cmyk(46%, 0%, 14%, 39%)
Oklch
oklch(63.9% 0.081 171.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#3D6A70

Slate Blue · SeaGreen · Mint Ice

HEX
#3D6A70
RGB
rgb(61, 106, 112)
HSL
hsl(187, 29%, 34%)
HSB
hsb(187, 46%, 44%)
CMYK
cmyk(46%, 5%, 0%, 56%)
Oklch
oklch(49.4% 0.050 206.6)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#262442

Deep Indigo · DarkSlateGray · Deep Sea Blue

HEX
#262442
RGB
rgb(38, 36, 66)
HSL
hsl(244, 29%, 20%)
HSB
hsb(244, 45%, 26%)
CMYK
cmyk(42%, 45%, 0%, 74%)
Oklch
oklch(27.8% 0.055 285.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFD8A
8A8CFF

Analogous

FFC28A
FFFD8A
C6FF8A

Triadic

FFFD8A
8AFFFD
FD8AFF

Split-Comp.

FFFD8A
8AC6FF
C28AFF

Tetradic

FFFD8A
8AFFC2
8A8CFF
FF8AC6

Contrast Matrix WCAG 2.1 Contrast

FFFD8A
A0C46A
549C86
3D6A70
262442
—
1.9
Fail
3.0
AA Large
5.6
AA
13.9
AAA
1.9
Fail
—
1.6
Fail
3.0
AA Large
7.5
AAA
3.0
AA Large
1.6
Fail
—
1.9
Fail
4.6
AA
5.6
AA
3.0
AA Large
1.9
Fail
—
2.5
Fail
13.9
AAA
7.5
AAA
4.6
AA
2.5
Fail
—
White BG
1.1Fail
2.0Fail
3.2AA Large
6.0AA
14.9AAA
Black BG
19.7AAA
10.6AAA
6.5AA
3.5AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FEFEA6
B0B080
73748B
50516F
25253B

Deuteranopia

FEFEAD
AEAB85
6F6A8D
4E4B6E
252539

Tritanopia

FFBCC1
A29195
589090
3F6D6D
263534

Achromatopsia

F0F0F0
AFAFAF
848484
5D5D5D
282828

Shades & Tints Shades & Tints

#FFFD8A

Dark
Light

#A0C46A

Dark
Light

#549C86

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffd8a;
  --color-2: #a0c46a;
  --color-3: #549c86;
  --color-4: #3d6a70;
  --color-5: #262442;
}

SCSS

$color-1: #fffd8a;
$color-2: #a0c46a;
$color-3: #549c86;
$color-4: #3d6a70;
$color-5: #262442;

TAILWIND

colors: {
  'brand-1': '#fffd8a',
  'brand-2': '#a0c46a',
  'brand-3': '#549c86',
  'brand-4': '#3d6a70',
  'brand-5': '#262442',
}

RGB Array

[255, 253, 138], [160, 196, 106], [84, 156, 134], [61, 106, 112], [38, 36, 66]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFD8A, #A0C46A, #549C86, #3D6A70, #262442 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fffd8a; --color-2: #a0c46a; --color-3: #549c86; --color-4: #3d6a70; --color-5: #262442. 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 tech, SaaS, healthcare, eco industries. 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