← Back to Editor

#625849 · #FC1D54 · #AA5C53 · #E95634 · #534739

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 Library

Color Details Color Details

#625849

Ochre · DarkOliveGreen · Amber Brown

HEX
#625849
RGB
rgb(98, 88, 73)
HSL
hsl(36, 15%, 34%)
HSB
hsb(36, 26%, 38%)
CMYK
cmyk(0%, 10%, 26%, 62%)
Oklch
oklch(46.6% 0.027 78.0)

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

#FC1D54

Vermilion · Crimson · Passion Red

HEX
#FC1D54
RGB
rgb(252, 29, 84)
HSL
hsl(345, 97%, 55%)
HSB
hsb(345, 88%, 99%)
CMYK
cmyk(0%, 88%, 67%, 1%)
Oklch
oklch(63.7% 0.244 16.6)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#AA5C53

Crimson · Sienna · Passion Red

HEX
#AA5C53
RGB
rgb(170, 92, 83)
HSL
hsl(6, 34%, 50%)
HSB
hsb(6, 51%, 67%)
CMYK
cmyk(0%, 46%, 51%, 33%)
Oklch
oklch(56.4% 0.104 27.7)

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

#E95634

Vermilion · Tomato · Passion Red

HEX
#E95634
RGB
rgb(233, 86, 52)
HSL
hsl(11, 80%, 56%)
HSB
hsb(11, 78%, 91%)
CMYK
cmyk(0%, 63%, 78%, 9%)
Oklch
oklch(64.4% 0.189 34.4)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#534739

Ochre · DarkOliveGreen · Amber Brown

HEX
#534739
RGB
rgb(83, 71, 57)
HSL
hsl(32, 19%, 27%)
HSB
hsb(32, 31%, 33%)
CMYK
cmyk(0%, 14%, 31%, 67%)
Oklch
oklch(40.6% 0.028 71.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

625849
4A5464

Analogous

644C4A
625849
61644A

Triadic

625849
4A6459
594A64

Split-Comp.

625849
4A6164
4C4A64

Tetradic

625849
4A644C
4A5464
644A61

Contrast Matrix WCAG 2.1 Contrast

625849
FC1D54
AA5C53
E95634
534739
—
1.8
Fail
1.4
Fail
1.9
Fail
1.3
Fail
1.8
Fail
—
1.2
Fail
1.1
Fail
2.3
Fail
1.4
Fail
1.2
Fail
—
1.3
Fail
1.9
Fail
1.9
Fail
1.1
Fail
1.3
Fail
—
2.5
Fail
1.3
Fail
2.3
Fail
1.9
Fail
2.5
Fail
—
White BG
7.0AA
3.9AA Large
4.8AA
3.6AA Large
9.0AAA
Black BG
3.0AA Large
5.4AA
4.4AA Large
5.8AA
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5E5E4D
9B9947
888855
A9A83C
4E4E3C

Deuteranopia

5E5F4E
A8B944
8D9356
B2BD3E
4F4F3D

Tritanopia

624F50
F13C3A
A65757
E24344
523F40

Achromatopsia

595959
666666
727272
7E7E7E
494949

Shades & Tints Shades & Tints

#625849

Dark
Light

#FC1D54

Dark
Light

#AA5C53

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #625849;
  --color-2: #fc1d54;
  --color-3: #aa5c53;
  --color-4: #e95634;
  --color-5: #534739;
}

SCSS

$color-1: #625849;
$color-2: #fc1d54;
$color-3: #aa5c53;
$color-4: #e95634;
$color-5: #534739;

TAILWIND

colors: {
  'brand-1': '#625849',
  'brand-2': '#fc1d54',
  'brand-3': '#aa5c53',
  'brand-4': '#e95634',
  'brand-5': '#534739',
}

RGB Array

[98, 88, 73], [252, 29, 84], [170, 92, 83], [233, 86, 52], [83, 71, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #625849, #FC1D54, #AA5C53, #E95634, #534739 is ideal for: corporate websites, product showcases, portfolios. 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: #625849; --color-2: #fc1d54; --color-3: #aa5c53; --color-4: #e95634; --color-5: #534739. 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. 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