← Back to Editor

#748A6A · #45270D · #9D9356 · #AB9205 · #FB5A02

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#748A6A

Celadon · Gray · Olive Green

HEX
#748A6A
RGB
rgb(116, 138, 106)
HSL
hsl(101, 13%, 48%)
HSB
hsb(101, 23%, 54%)
CMYK
cmyk(16%, 0%, 23%, 46%)
Oklch
oklch(60.7% 0.054 136.0)

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

#45270D

Tangerine · Maroon · Cinnamon

HEX
#45270D
RGB
rgb(69, 39, 13)
HSL
hsl(28, 68%, 16%)
HSB
hsb(28, 81%, 27%)
CMYK
cmyk(0%, 43%, 81%, 73%)
Oklch
oklch(30.6% 0.059 58.5)

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

#9D9356

Autumn Sage · Gray · Honey Gold

HEX
#9D9356
RGB
rgb(157, 147, 86)
HSL
hsl(52, 29%, 48%)
HSB
hsb(52, 45%, 62%)
CMYK
cmyk(0%, 6%, 45%, 38%)
Oklch
oklch(65.8% 0.082 100.1)

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

#AB9205

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#AB9205
RGB
rgb(171, 146, 5)
HSL
hsl(51, 94%, 35%)
HSB
hsb(51, 97%, 67%)
CMYK
cmyk(0%, 15%, 97%, 33%)
Oklch
oklch(66.3% 0.136 96.8)

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

#FB5A02

Tangerine · OrangeRed · Amber Brown

HEX
#FB5A02
RGB
rgb(251, 90, 2)
HSL
hsl(21, 98%, 50%)
HSB
hsb(21, 99%, 98%)
CMYK
cmyk(0%, 64%, 99%, 2%)
Oklch
oklch(67.5% 0.210 40.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

748A6A
806A8A

Analogous

848A6A
748A6A
6A8A70

Triadic

748A6A
6A758A
8A6A75

Split-Comp.

748A6A
706A8A
8A6A84

Tetradic

748A6A
6A848A
806A8A
8A706A

Contrast Matrix WCAG 2.1 Contrast

748A6A
45270D
9D9356
AB9205
FB5A02
—
3.6
AA Large
1.2
Fail
1.2
Fail
1.2
Fail
3.6
AA Large
—
4.4
AA Large
4.4
AA Large
4.2
AA Large
1.2
Fail
4.4
AA Large
—
1.0
Fail
1.0
Fail
1.2
Fail
4.4
AA Large
1.0
Fail
—
1.0
Fail
1.2
Fail
4.2
AA Large
1.0
Fail
1.0
Fail
—
White BG
3.8AA Large
13.6AAA
3.1AA Large
3.1AA Large
3.2AA Large
Black BG
5.6AA
1.5Fail
6.7AA
6.8AA
6.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7E72
383813
999965
A0A027
B5B417

Deuteranopia

7C7B74
3A3C15
999A68
A2A42F
BFCB1C

Tritanopia

757879
441819
9D7073
AA4248
F3282C

Achromatopsia

808080
2D2D2D
8F8F8F
898989
808080

Shades & Tints Shades & Tints

#748A6A

Dark
Light

#45270D

Dark
Light

#9D9356

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #748a6a;
  --color-2: #45270d;
  --color-3: #9d9356;
  --color-4: #ab9205;
  --color-5: #fb5a02;
}

SCSS

$color-1: #748a6a;
$color-2: #45270d;
$color-3: #9d9356;
$color-4: #ab9205;
$color-5: #fb5a02;

TAILWIND

colors: {
  'brand-1': '#748a6a',
  'brand-2': '#45270d',
  'brand-3': '#9d9356',
  'brand-4': '#ab9205',
  'brand-5': '#fb5a02',
}

RGB Array

[116, 138, 106], [69, 39, 13], [157, 147, 86], [171, 146, 5], [251, 90, 2]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #748A6A, #45270D, #9D9356, #AB9205, #FB5A02 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #748a6a; --color-2: #45270d; --color-3: #9d9356; --color-4: #ab9205; --color-5: #fb5a02. 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. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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