#B30961 + #B1479A + #A87FCD + #A6BAB2 + #B1D27D · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#B30961

Rose Purple · MediumVioletRed · Camellia

HEX

#B30961

RGB

rgb(179, 9, 97)

HSL

hsl(329, 90%, 37%)

HSB

hsb(329, 95%, 70%)

CMYK

cmyk(0%, 95%, 46%, 30%)

Oklch

oklch(50.0% 0.199 358.9)

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

#B1479A

Rose Purple · MediumVioletRed · Violet

HEX

#B1479A

RGB

rgb(177, 71, 154)

HSL

hsl(313, 43%, 49%)

HSB

hsb(313, 60%, 69%)

CMYK

cmyk(0%, 60%, 13%, 31%)

Oklch

oklch(56.7% 0.169 336.9)

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

#A87FCD

Lilac · MediumOrchid · Lilac Purple

HEX

#A87FCD

RGB

rgb(168, 127, 205)

HSL

hsl(272, 44%, 65%)

HSB

hsb(272, 38%, 80%)

CMYK

cmyk(18%, 38%, 0%, 20%)

Oklch

oklch(66.6% 0.120 307.6)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#A6BAB2

Jade · DarkGray · Apple Green

HEX

#A6BAB2

RGB

rgb(166, 186, 178)

HSL

hsl(156, 13%, 69%)

HSB

hsb(156, 11%, 73%)

CMYK

cmyk(11%, 0%, 4%, 27%)

Oklch

oklch(77.1% 0.025 169.7)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#B1D27D

Willow Green · DarkSeaGreen · Apple Green

HEX

#B1D27D

RGB

rgb(177, 210, 125)

HSL

hsl(83, 49%, 66%)

HSB

hsb(83, 40%, 82%)

CMYK

cmyk(16%, 0%, 40%, 18%)

Oklch

oklch(82.0% 0.117 126.2)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B30961

09B35C

Analogous

B009B3

B30961

B3090C

Triadic

B30961

61B309

0961B3

Split-Comp.

B30961

0CB309

09B3B0

Tetradic

B30961

B3B009

09B35C

090CB3

Contrast Matrix WCAG 2.1 Contrast

B30961	B1479A	A87FCD	A6BAB2	B1D27D
—	1.4 Fail	2.1 Fail	3.3 AA Large	4.0 AA Large
1.4 Fail	—	1.6 Fail	2.4 Fail	2.9 Fail
2.1 Fail	1.6 Fail	—	1.6 Fail	1.9 Fail
3.3 AA Large	2.4 Fail	1.6 Fail	—	1.2 Fail
4.0 AA Large	2.9 Fail	1.9 Fail	1.2 Fail	—

White BG

6.7AA

5.0AA

3.2AA Large

2.0Fail

1.7Fail

Black BG

3.1AA Large

4.2AA Large

6.6AA

10.3AAA

12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

69684C

838286

9696BA

AFAFB4

BFC092

Deuteranopia

738047

899181

999CB6

AEACB4

BDBB97

Tritanopia

AA3B37

AC7673

A6ABA8

A7B5B6

B3A2A5

Achromatopsia

464646

707070

949494

B3B3B3

BEBEBE

Shades & Tints Shades & Tints

#B30961

Dark

Light

#B1479A

Dark

Light

#A87FCD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b30961;
  --color-2: #b1479a;
  --color-3: #a87fcd;
  --color-4: #a6bab2;
  --color-5: #b1d27d;
}

SCSS

$color-1: #b30961;
$color-2: #b1479a;
$color-3: #a87fcd;
$color-4: #a6bab2;
$color-5: #b1d27d;

TAILWIND

colors: {
  'brand-1': '#b30961',
  'brand-2': '#b1479a',
  'brand-3': '#a87fcd',
  'brand-4': '#a6bab2',
  'brand-5': '#b1d27d',
}

RGB Array

[179, 9, 97], [177, 71, 154], [168, 127, 205], [166, 186, 178], [177, 210, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #B30961, #B1479A, #A87FCD, #A6BAB2, #B1D27D 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: #b30961; --color-2: #b1479a; --color-3: #a87fcd; --color-4: #a6bab2; --color-5: #b1d27d. 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 nature-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