← Back to Editor

#FFFDF3 · #936857 · #723D39 · #551525 · #362E2C

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

#FFFDF3

Fresh Green · Snow · Lemon Cream

HEX
#FFFDF3
RGB
rgb(255, 253, 243)
HSL
hsl(50, 100%, 98%)
HSB
hsb(50, 5%, 100%)
CMYK
cmyk(0%, 1%, 5%, 0%)
Oklch
oklch(99.3% 0.013 97.4)

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

#936857

Tangerine · DimGray · Amber Brown

HEX
#936857
RGB
rgb(147, 104, 87)
HSL
hsl(17, 26%, 46%)
HSB
hsb(17, 41%, 58%)
CMYK
cmyk(0%, 29%, 41%, 42%)
Oklch
oklch(55.7% 0.061 42.5)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#723D39

Crimson · Sienna · Wine Red

HEX
#723D39
RGB
rgb(114, 61, 57)
HSL
hsl(4, 33%, 34%)
HSB
hsb(4, 50%, 45%)
CMYK
cmyk(0%, 46%, 50%, 55%)
Oklch
oklch(42.5% 0.075 25.2)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#551525

Crimson · Maroon · Wine Red

HEX
#551525
RGB
rgb(85, 21, 37)
HSL
hsl(345, 60%, 21%)
HSB
hsb(345, 75%, 33%)
CMYK
cmyk(0%, 75%, 56%, 67%)
Oklch
oklch(30.8% 0.094 9.8)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#362E2C

Crimson · DarkSlateGray · Deep Berry

HEX
#362E2C
RGB
rgb(54, 46, 44)
HSL
hsl(12, 10%, 19%)
HSB
hsb(12, 19%, 21%)
CMYK
cmyk(0%, 15%, 19%, 79%)
Oklch
oklch(30.9% 0.012 34.3)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFDF3
F5F6FF

Analogous

FFF8F5
FFFDF3
FCFFF5

Triadic

FFFDF3
F5FFFD
FDF5FF

Split-Comp.

FFFDF3
F5FCFF
F8F5FF

Tetradic

FFFDF3
F5FFF8
F5F6FF
FFF5FC

Contrast Matrix WCAG 2.1 Contrast

FFFDF3
936857
723D39
551525
362E2C
—
4.7
AA
8.4
AAA
13.5
AAA
13.0
AAA
4.7
AA
—
1.8
Fail
2.9
Fail
2.8
Fail
8.4
AAA
1.8
Fail
—
1.6
Fail
1.5
Fail
13.5
AAA
2.9
Fail
1.6
Fail
—
1.0
Fail
13.0
AAA
2.8
Fail
1.5
Fail
1.0
Fail
—
White BG
1.0Fail
4.8AA
8.6AAA
13.8AAA
13.3AAA
Black BG
20.6AAA
4.4AA Large
2.4Fail
1.5Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FEFEF5
80805B
5B5B3A
393921
33322C

Deuteranopia

FEFEF6
83865C
5E623A
3D4220
33342D

Tritanopia

FFF7F8
915E5F
6F3B3B
521E1D
362D2D

Achromatopsia

FCFCFC
737373
4C4C4C
2A2A2A
303030

Shades & Tints Shades & Tints

#FFFDF3

Dark
Light

#936857

Dark
Light

#723D39

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffdf3;
  --color-2: #936857;
  --color-3: #723d39;
  --color-4: #551525;
  --color-5: #362e2c;
}

SCSS

$color-1: #fffdf3;
$color-2: #936857;
$color-3: #723d39;
$color-4: #551525;
$color-5: #362e2c;

TAILWIND

colors: {
  'brand-1': '#fffdf3',
  'brand-2': '#936857',
  'brand-3': '#723d39',
  'brand-4': '#551525',
  'brand-5': '#362e2c',
}

RGB Array

[255, 253, 243], [147, 104, 87], [114, 61, 57], [85, 21, 37], [54, 46, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFDF3, #936857, #723D39, #551525, #362E2C 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: #fffdf3; --color-2: #936857; --color-3: #723d39; --color-4: #551525; --color-5: #362e2c. 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