← Back to Editor

#FFFF00 · #191717 · #625555 · #DDDEAB · #51513B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FFFF00

Autumn Sage · Yellow · Honey Gold

HEX
#FFFF00
RGB
rgb(255, 255, 0)
HSL
hsl(60, 100%, 50%)
HSB
hsb(60, 100%, 100%)
CMYK
cmyk(0%, 0%, 100%, 0%)
Oklch
oklch(96.8% 0.211 109.8)

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

#191717

Ink Black · Black · Jet Black

HEX
#191717
RGB
rgb(25, 23, 23)
HSL
hsl(0, 4%, 9%)
HSB
hsb(0, 8%, 10%)
CMYK
cmyk(0%, 8%, 8%, 90%)
Oklch
oklch(20.7% 0.003 17.4)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#625555

Ink Gray · DimGray · Charcoal

HEX
#625555
RGB
rgb(98, 85, 85)
HSL
hsl(0, 7%, 36%)
HSB
hsb(0, 13%, 38%)
CMYK
cmyk(0%, 13%, 13%, 62%)
Oklch
oklch(46.2% 0.017 17.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#DDDEAB

Fresh Green · Wheat · Lemon Cream

HEX
#DDDEAB
RGB
rgb(221, 222, 171)
HSL
hsl(61, 44%, 77%)
HSB
hsb(61, 23%, 87%)
CMYK
cmyk(0%, 0%, 23%, 13%)
Oklch
oklch(88.7% 0.067 108.6)

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

#51513B

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#51513B
RGB
rgb(81, 81, 59)
HSL
hsl(60, 16%, 27%)
HSB
hsb(60, 27%, 32%)
CMYK
cmyk(0%, 0%, 27%, 68%)
Oklch
oklch(42.9% 0.034 107.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFF00
0000FF

Analogous

FF8000
FFFF00
80FF00

Triadic

FFFF00
00FFFF
FF00FF

Split-Comp.

FFFF00
0080FF
8000FF

Tetradic

FFFF00
00FF80
0000FF
FF0080

Contrast Matrix WCAG 2.1 Contrast

FFFF00
191717
625555
DDDEAB
51513B
—
16.6
AAA
6.6
AA
1.3
Fail
7.6
AAA
16.6
AAA
—
2.5
Fail
12.8
AAA
2.2
Fail
6.6
AA
2.5
Fail
—
5.1
AA
1.1
Fail
1.3
Fail
12.8
AAA
5.1
AA
—
5.8
AA
7.6
AAA
2.2
Fail
1.1
Fail
5.8
AA
—
White BG
1.1Fail
17.9AAA
7.1AAA
1.4Fail
8.1AAA
Black BG
19.6AAA
1.2Fail
2.9Fail
15.1AAA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FFFF3E
181817
5C5C55
DDDDB7
515140

Deuteranopia

FFFF4D
181817
5D5E55
DDDDBA
515142

Tritanopia

FF6E79
191717
615555
DDC1C3
514545

Achromatopsia

E2E2E2
181818
595959
D8D8D8
4E4E4E

Shades & Tints Shades & Tints

#FFFF00

Dark
Light

#191717

Dark
Light

#625555

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffff00;
  --color-2: #191717;
  --color-3: #625555;
  --color-4: #dddeab;
  --color-5: #51513b;
}

SCSS

$color-1: #ffff00;
$color-2: #191717;
$color-3: #625555;
$color-4: #dddeab;
$color-5: #51513b;

TAILWIND

colors: {
  'brand-1': '#ffff00',
  'brand-2': '#191717',
  'brand-3': '#625555',
  'brand-4': '#dddeab',
  'brand-5': '#51513b',
}

RGB Array

[255, 255, 0], [25, 23, 23], [98, 85, 85], [221, 222, 171], [81, 81, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFF00, #191717, #625555, #DDDEAB, #51513B is ideal for: tech websites, dark mode UIs, game UIs, 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: #ffff00; --color-2: #191717; --color-3: #625555; --color-4: #dddeab; --color-5: #51513b. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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