← Back to Editor

#39312C · #FFFBEB · #927DA7 · #654654 · #E5E421

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

#39312C

Tangerine · DarkSlateGray · Cinnamon

HEX
#39312C
RGB
rgb(57, 49, 44)
HSL
hsl(23, 13%, 20%)
HSB
hsb(23, 23%, 22%)
CMYK
cmyk(0%, 14%, 23%, 78%)
Oklch
oklch(32.0% 0.014 54.0)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#FFFBEB

Goose Yellow · SeaShell · Lemon Cream

HEX
#FFFBEB
RGB
rgb(255, 251, 235)
HSL
hsl(48, 100%, 96%)
HSB
hsb(48, 8%, 100%)
CMYK
cmyk(0%, 2%, 8%, 0%)
Oklch
oklch(98.7% 0.021 95.3)

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

#927DA7

Dark Plum · LightSlateGray · Violet

HEX
#927DA7
RGB
rgb(146, 125, 167)
HSL
hsl(270, 19%, 57%)
HSB
hsb(270, 25%, 65%)
CMYK
cmyk(13%, 25%, 0%, 35%)
Oklch
oklch(62.4% 0.066 307.3)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#654654

Dark Violet · DimGray · Camellia

HEX
#654654
RGB
rgb(101, 70, 84)
HSL
hsl(333, 18%, 34%)
HSB
hsb(333, 31%, 40%)
CMYK
cmyk(0%, 31%, 17%, 60%)
Oklch
oklch(43.3% 0.047 350.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#E5E421

Autumn Sage · Gold · Sunflower

HEX
#E5E421
RGB
rgb(229, 228, 33)
HSL
hsl(60, 79%, 51%)
HSB
hsb(60, 86%, 90%)
CMYK
cmyk(0%, 0%, 86%, 10%)
Oklch
oklch(89.1% 0.188 109.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

39312C
2C353A

Analogous

3A2C2E
39312C
3A382C

Triadic

39312C
2C3A31
312C3A

Split-Comp.

39312C
2C3A38
2C2E3A

Tetradic

39312C
2E3A2C
2C353A
382C3A

Contrast Matrix WCAG 2.1 Contrast

39312C
FFFBEB
927DA7
654654
E5E421
—
12.3
AAA
3.5
AA Large
1.6
Fail
9.4
AAA
12.3
AAA
—
3.5
AA Large
7.9
AAA
1.3
Fail
3.5
AA Large
3.5
AA Large
—
2.2
Fail
2.7
Fail
1.6
Fail
7.9
AAA
2.2
Fail
—
6.0
AA
9.4
AAA
1.3
Fail
2.7
Fail
6.0
AA
—
White BG
12.7AAA
1.0Fail
3.7AA Large
8.2AAA
1.4Fail
Black BG
1.6Fail
20.3AAA
5.7AA
2.6Fail
15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

36352D
FDFDEF
89899D
585751
E5E550

Deuteranopia

36372E
FEFEF0
8A8C9A
595C50
E5E55B

Tritanopia

392E2E
FFF2F3
919593
634E4D
E5757E

Achromatopsia

333333
FAFAFA
888888
515151
CECECE

Shades & Tints Shades & Tints

#39312C

Dark
Light

#FFFBEB

Dark
Light

#927DA7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #39312c;
  --color-2: #fffbeb;
  --color-3: #927da7;
  --color-4: #654654;
  --color-5: #e5e421;
}

SCSS

$color-1: #39312c;
$color-2: #fffbeb;
$color-3: #927da7;
$color-4: #654654;
$color-5: #e5e421;

TAILWIND

colors: {
  'brand-1': '#39312c',
  'brand-2': '#fffbeb',
  'brand-3': '#927da7',
  'brand-4': '#654654',
  'brand-5': '#e5e421',
}

RGB Array

[57, 49, 44], [255, 251, 235], [146, 125, 167], [101, 70, 84], [229, 228, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #39312C, #FFFBEB, #927DA7, #654654, #E5E421 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: #39312c; --color-2: #fffbeb; --color-3: #927da7; --color-4: #654654; --color-5: #e5e421. 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