← Back to Editor

#723504 · #BBBB55 · #F4F2F2 · #A83004 · #F3A359

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 AppData Visualization

Color Details Color Details

#723504

Tangerine · Maroon · Cinnamon

HEX
#723504
RGB
rgb(114, 53, 4)
HSL
hsl(27, 93%, 23%)
HSB
hsb(27, 96%, 45%)
CMYK
cmyk(0%, 54%, 96%, 55%)
Oklch
oklch(40.3% 0.102 51.4)

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

#BBBB55

Autumn Sage · Tan · Sunflower

HEX
#BBBB55
RGB
rgb(187, 187, 85)
HSL
hsl(60, 43%, 53%)
HSB
hsb(60, 55%, 73%)
CMYK
cmyk(0%, 0%, 55%, 27%)
Oklch
oklch(77.1% 0.125 109.0)

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

#F4F2F2

Peach Pink · SeaShell · Cloud White

HEX
#F4F2F2
RGB
rgb(244, 242, 242)
HSL
hsl(0, 8%, 95%)
HSB
hsb(0, 1%, 96%)
CMYK
cmyk(0%, 1%, 1%, 4%)
Oklch
oklch(96.3% 0.002 17.2)

Traditional「Peach Pink」· Paint「Cloud White」· Creative Morning Mist

#A83004

Tangerine · FireBrick · Amber Brown

HEX
#A83004
RGB
rgb(168, 48, 4)
HSL
hsl(16, 95%, 34%)
HSB
hsb(16, 98%, 66%)
CMYK
cmyk(0%, 71%, 98%, 34%)
Oklch
oklch(48.9% 0.163 36.6)

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

#F3A359

Apricot · SandyBrown · Warm Sun

HEX
#F3A359
RGB
rgb(243, 163, 89)
HSL
hsl(29, 87%, 65%)
HSB
hsb(29, 63%, 95%)
CMYK
cmyk(0%, 33%, 63%, 5%)
Oklch
oklch(78.0% 0.131 61.7)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

723504
044071

Analogous

71040A
723504
716C04

Triadic

723504
047135
350471

Split-Comp.

723504
04716C
040A71

Tetradic

723504
0A7104
044071
6C0471

Contrast Matrix WCAG 2.1 Contrast

723504
BBBB55
F4F2F2
A83004
F3A359
—
4.6
AA
8.5
AAA
1.4
Fail
4.6
AA
4.6
AA
—
1.8
Fail
3.4
AA Large
1.0
Fail
8.5
AAA
1.8
Fail
—
6.1
AA
1.8
Fail
1.4
Fail
3.4
AA Large
6.1
AA
—
3.3
AA Large
4.6
AA
1.0
Fail
1.8
Fail
3.3
AA Large
—
White BG
9.4AAA
2.0Fail
1.1Fail
6.8AA
2.1Fail
Black BG
2.2Fail
10.4AAA
18.8AAA
3.1AA Large
10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

585710
BBBB6E
F3F3F2
74730F
D0D06B

Deuteranopia

5B6013
BBBB74
F3F3F2
7B8411
D5DB6F

Tritanopia

6F191B
BB8185
F4F2F2
A21719
EF797C

Achromatopsia

424242
AFAFAF
F3F3F3
4F4F4F
B2B2B2

Shades & Tints Shades & Tints

#723504

Dark
Light

#BBBB55

Dark
Light

#F4F2F2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #723504;
  --color-2: #bbbb55;
  --color-3: #f4f2f2;
  --color-4: #a83004;
  --color-5: #f3a359;
}

SCSS

$color-1: #723504;
$color-2: #bbbb55;
$color-3: #f4f2f2;
$color-4: #a83004;
$color-5: #f3a359;

TAILWIND

colors: {
  'brand-1': '#723504',
  'brand-2': '#bbbb55',
  'brand-3': '#f4f2f2',
  'brand-4': '#a83004',
  'brand-5': '#f3a359',
}

RGB Array

[114, 53, 4], [187, 187, 85], [244, 242, 242], [168, 48, 4], [243, 163, 89]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #723504, #BBBB55, #F4F2F2, #A83004, #F3A359 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #723504; --color-2: #bbbb55; --color-3: #f4f2f2; --color-4: #a83004; --color-5: #f3a359. 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 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