← Back to Editor

#3A332E · #00A99C · #F2941B · #F01F7C · #FBD40C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#3A332E

Tangerine · DarkSlateGray · Cinnamon

HEX
#3A332E
RGB
rgb(58, 51, 46)
HSL
hsl(25, 12%, 20%)
HSB
hsb(25, 21%, 23%)
CMYK
cmyk(0%, 12%, 21%, 77%)
Oklch
oklch(32.7% 0.013 57.8)

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

#00A99C

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#00A99C
RGB
rgb(0, 169, 156)
HSL
hsl(175, 100%, 33%)
HSB
hsb(175, 100%, 66%)
CMYK
cmyk(100%, 0%, 8%, 34%)
Oklch
oklch(66.1% 0.116 185.2)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#F2941B

Ginger · GoldenRod · Warm Sun

HEX
#F2941B
RGB
rgb(242, 148, 27)
HSL
hsl(34, 89%, 53%)
HSB
hsb(34, 89%, 95%)
CMYK
cmyk(0%, 39%, 89%, 5%)
Oklch
oklch(74.8% 0.162 64.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#F01F7C

Dark Violet · DeepPink · Rose Pink

HEX
#F01F7C
RGB
rgb(240, 31, 124)
HSL
hsl(333, 87%, 53%)
HSB
hsb(333, 87%, 94%)
CMYK
cmyk(0%, 87%, 48%, 6%)
Oklch
oklch(62.6% 0.240 2.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#FBD40C

Autumn Sage · Gold · Sunflower

HEX
#FBD40C
RGB
rgb(251, 212, 12)
HSL
hsl(50, 97%, 52%)
HSB
hsb(50, 95%, 98%)
CMYK
cmyk(0%, 16%, 95%, 2%)
Oklch
oklch(87.7% 0.179 95.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3A332E
2D3439

Analogous

392D2E
3A332E
39382D

Triadic

3A332E
2D3932
322D39

Split-Comp.

3A332E
2D3938
2D2E39

Tetradic

3A332E
2E392D
2D3439
382D39

Contrast Matrix WCAG 2.1 Contrast

3A332E
00A99C
F2941B
F01F7C
FBD40C
—
4.2
AA Large
5.3
AA
3.1
AA Large
8.6
AAA
4.2
AA Large
—
1.3
Fail
1.4
Fail
2.0
Fail
5.3
AA
1.3
Fail
—
1.7
Fail
1.6
Fail
3.1
AA Large
1.4
Fail
1.7
Fail
—
2.8
Fail
8.6
AAA
2.0
Fail
1.6
Fail
2.8
Fail
—
White BG
12.4AAA
2.9Fail
2.3Fail
4.0AA Large
1.4Fail
Black BG
1.7Fail
7.2AAA
9.0AAA
5.2AA
14.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

37372F
494B9F
C9C838
969465
EAEA3C

Deuteranopia

37382F
3F33A0
CFD63F
A2B160
ECEF48

Tritanopia

3A3030
08A2A2
ED4F54
E65450
F9636B

Achromatopsia

353535
757575
A2A2A2
686868
C9C9C9

Shades & Tints Shades & Tints

#3A332E

Dark
Light

#00A99C

Dark
Light

#F2941B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3a332e;
  --color-2: #00a99c;
  --color-3: #f2941b;
  --color-4: #f01f7c;
  --color-5: #fbd40c;
}

SCSS

$color-1: #3a332e;
$color-2: #00a99c;
$color-3: #f2941b;
$color-4: #f01f7c;
$color-5: #fbd40c;

TAILWIND

colors: {
  'brand-1': '#3a332e',
  'brand-2': '#00a99c',
  'brand-3': '#f2941b',
  'brand-4': '#f01f7c',
  'brand-5': '#fbd40c',
}

RGB Array

[58, 51, 46], [0, 169, 156], [242, 148, 27], [240, 31, 124], [251, 212, 12]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3A332E, #00A99C, #F2941B, #F01F7C, #FBD40C is ideal for: social media posters, mobile apps, e-commerce promos. 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: #3a332e; --color-2: #00a99c; --color-3: #f2941b; --color-4: #f01f7c; --color-5: #fbd40c. 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 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