← Back to Editor

#07050A · #0D182E · #5F1145 · #D44A1B · #F7B11E

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile AppData Visualization

Color Details Color Details

#07050A

Deep Indigo · Black · Dark Purple

HEX
#07050A
RGB
rgb(7, 5, 10)
HSL
hsl(264, 33%, 3%)
HSB
hsb(264, 50%, 4%)
CMYK
cmyk(30%, 50%, 0%, 96%)
Oklch
oklch(12.2% 0.014 304.9)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#0D182E

Indigo · Black · Deep Sea Blue

HEX
#0D182E
RGB
rgb(13, 24, 46)
HSL
hsl(220, 56%, 12%)
HSB
hsb(220, 72%, 18%)
CMYK
cmyk(72%, 48%, 0%, 82%)
Oklch
oklch(21.2% 0.047 262.9)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#5F1145

Rose Purple · Purple · Raspberry

HEX
#5F1145
RGB
rgb(95, 17, 69)
HSL
hsl(320, 70%, 22%)
HSB
hsb(320, 82%, 37%)
CMYK
cmyk(0%, 82%, 27%, 63%)
Oklch
oklch(33.6% 0.123 345.0)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#D44A1B

Tangerine · Chocolate · Amber Brown

HEX
#D44A1B
RGB
rgb(212, 74, 27)
HSL
hsl(15, 77%, 47%)
HSB
hsb(15, 87%, 83%)
CMYK
cmyk(0%, 65%, 87%, 17%)
Oklch
oklch(59.5% 0.182 37.4)

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

#F7B11E

Ginger · GoldenRod · Sunflower

HEX
#F7B11E
RGB
rgb(247, 177, 30)
HSL
hsl(41, 93%, 54%)
HSB
hsb(41, 88%, 97%)
CMYK
cmyk(0%, 28%, 88%, 3%)
Oklch
oklch(80.6% 0.162 78.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

07050A
080A05

Analogous

05060A
07050A
0A050A

Triadic

07050A
0A0705
050A07

Split-Comp.

07050A
0A0A05
060A05

Tetradic

07050A
0A0506
080A05
050A0A

Contrast Matrix WCAG 2.1 Contrast

07050A
0D182E
5F1145
D44A1B
F7B11E
—
1.1
Fail
1.6
Fail
4.6
AA
10.9
AAA
1.1
Fail
—
1.4
Fail
4.0
AA Large
9.5
AAA
1.6
Fail
1.4
Fail
—
2.9
Fail
6.8
AA
4.6
AA
4.0
AA Large
2.9
Fail
—
2.3
Fail
10.9
AAA
9.5
AAA
6.8
AA
2.3
Fail
—
White BG
20.3AAA
17.7AAA
12.7AAA
4.4AA Large
1.9Fail
Black BG
1.0Fail
1.2Fail
1.7Fail
4.8AA
11.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

060609
121229
3D3D38
989726
D9D842

Deuteranopia

060609
111027
424835
A0AB29
DDE24A

Tritanopia

070808
0E2424
5B2E2C
CD2F31
F35E64

Achromatopsia

060606
171717
2E2E2E
6E6E6E
B5B5B5

Shades & Tints Shades & Tints

#07050A

Dark
Light

#0D182E

Dark
Light

#5F1145

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #07050a;
  --color-2: #0d182e;
  --color-3: #5f1145;
  --color-4: #d44a1b;
  --color-5: #f7b11e;
}

SCSS

$color-1: #07050a;
$color-2: #0d182e;
$color-3: #5f1145;
$color-4: #d44a1b;
$color-5: #f7b11e;

TAILWIND

colors: {
  'brand-1': '#07050a',
  'brand-2': '#0d182e',
  'brand-3': '#5f1145',
  'brand-4': '#d44a1b',
  'brand-5': '#f7b11e',
}

RGB Array

[7, 5, 10], [13, 24, 46], [95, 17, 69], [212, 74, 27], [247, 177, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #07050A, #0D182E, #5F1145, #D44A1B, #F7B11E is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #07050a; --color-2: #0d182e; --color-3: #5f1145; --color-4: #d44a1b; --color-5: #f7b11e. 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. 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 nature-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