Muted Blush#D8B7B4
Soft Sage#9CAD99
Creamy Taupe#CBB9A3
Soft Silver#B9B6B1
Warm Beige#E7D9CA
Palette direction

Soft Blush Sage Color Palette

This palette blends soft neutrals with delicate blush tones and gentle sage greens to create a serene, elegant brand identity. The harmonious mix of muted colors and fresh greens evokes calmness and sophistication, ideal for a beauty or wellness salon.

AnalogousHealth Wellnessblushsageneutralsoft
palette-preview.example
Health Wellness color direction

Soft Blush Sage Color Palette

This palette blends soft neutrals with delicate blush tones and gentle sage greens to create a serene, elegant brand identity. The harmonious mix of muted colors and fresh greens evokes calmness and sophistication, ideal for a beauty or wellness salon.

Explore the color system
Logo contrast guide

Logo color pairings

ColorFly checks the palette colors against each other and suggests the clearest logo/background combinations.

Logo Deep Taupe #5B5449on Pure White #FFFFFF7.5:1 Excellent
Logo Pure White #FFFFFFon Deep Taupe #5B54497.5:1 Excellent
Logo Deep Taupe #5B5449on Warm Beige #E7D9CA5.4:1 Strong
Icon color
BackgroundMuted Blush#D8B7B4TextDeep Taupe#5B5449
Primary Button4.04:1
Large text

Best for the main action users should notice first.

BackgroundSoft Sage#9CAD99TextDeep Taupe#5B5449
Secondary Button3.15:1
Large text

Useful for softer choices and secondary paths.

BackgroundWarm Beige#E7D9CATextSoft Sage#9CAD99
Outlined Button1.71:1
Low

Good for lower-emphasis actions on light surfaces.

BackgroundWarm Beige#E7D9CATextMuted Blush#D8B7B4
Text Button1.34:1
Low

A quiet action for links, navigation, and inline decisions.

Palette composition8 colorsAnalogous color relationship
9:41Soft Blush Sage Color Palette Color role balance
Analogous system
60% DominantNeutrals

Backgrounds, large surfaces, whitespace, and reading comfort.

30% SecondarySupport colors

Sections, secondary UI, illustrations, and repeated brand moments.

10% AccentMain colors

High-attention moments like primary actions and memorable highlights.

CSoft Blush Sage Color PaletteHealth Wellness brand direction ColorFly.design
Strategic palette preview

Color Roles and Usage Map

Assign existing palette colors to brand, typography, and interface roles.

Brand identity

LogoUsed for logo marks and core brand symbols.Muted Blush #D8B7B4
HeadlineUsed for main titles and key messages.Creamy Taupe #CBB9A3
LinkUsed for links and interactive text.Muted Blush #D8B7B4

Buttons

Primary Button
BackgroundMuted Blush #D8B7B4
TextDeep Taupe #5B5449
Secondary Button
BackgroundSoft Sage #9CAD99
TextDeep Taupe #5B5449
Outlined Button
BackgroundSoft Sage #9CAD99
TextSoft Sage #9CAD99

Interface

TextDefault readable body text.Deep Taupe #5B5449
Bg LightLight page or section background.Warm Beige #E7D9CA
Bg DarkDark page or section background.Pure White #FFFFFF
IconSmall interface icons and marks.Soft Silver #B9B6B1
BorderCards, inputs, and component borders.Soft Silver #B9B6B1
DividerSubtle separators between content.Soft Silver #B9B6B1
OutlineFocus rings and emphasis outlines.Soft Silver #B9B6B1

Palette Colors

A compact view of the brand, support, and neutral colors that make up this system.

Main (Brand) Colors

The main colors are soft blush, muted sage, and creamy taupe, which together create a refined and harmonious impression suitable for a beauty or wellness brand.

PrimaryMuted Blush

RolesLogo, Link, Btn Primary Bg

Muted Blush brings warmth and softness fostering a welcoming and gentle atmosphere.

HEX#D8B7B4
RGB216, 183, 180
HSL5, 32, 78
CMYK0, 15, 17, 15
SecondarySoft Sage

RolesBtn Secondary Bg, Btn Outlined Border, Btn Outlined Text

Soft Sage introduces freshness and calm, balancing warmth with a natural feel.

HEX#9CAD99
RGB156, 173, 153
HSL111, 11, 64
CMYK10, 0, 12, 32
TertiaryCreamy Taupe

RolesHeadline

Creamy Taupe adds subtle earthiness and sophistication anchoring the palette.

HEX#CBB9A3
RGB203, 185, 163
HSL33, 28, 72
CMYK0, 9, 20, 20

Support Colors

The support colors extend the palette with a delicate silver and a warm beige, enhancing elegance and usability without overpowering.

Soft Silver

RolesIcon, Border, Divider, Outline

Soft Silver enriches with gentle neutrality and visual balance complementing the main colors.

HEX#B9B6B1
RGB185, 182, 177
HSL38, 5, 71
CMYK0, 2, 4, 27
Warm Beige

RolesBg Light

Warm Beige provides a light and airy background enhancing readability and warmth.

HEX#E7D9CA
RGB231, 217, 202
HSL31, 38, 85
CMYK0, 6, 13, 9

Neutral Colors

Utility colors for backgrounds, text, borders, and balance.

Pure White

RolesBg Dark

HEX#FFFFFF
RGB255, 255, 255
HSL0, 0, 100
CMYK0, 0, 0, 0
Near White
HEX#F9F6F4
RGB249, 246, 244
HSL24, 29, 97
CMYK0, 1, 2, 2
Deep Taupe

RolesText, Btn Primary Text, Btn Secondary Text

HEX#5B5449
RGB91, 84, 73
HSL37, 11, 32
CMYK0, 8, 20, 64

Export and Handoff

Copy palette values for design systems, websites, and client handoff.

Color tokens

Use these in CSS when you want every raw palette color available by name. Best for websites, landing pages, and design system variables.

Use when: you need the actual colors.
:root {
  --color-muted-blush: #D8B7B4;
  --color-soft-sage: #9CAD99;
  --color-creamy-taupe: #CBB9A3;
  --color-soft-silver: #B9B6B1;
  --color-warm-beige: #E7D9CA;
  --color-pure-white: #FFFFFF;
  --color-near-white: #F9F6F4;
  --color-deep-taupe: #5B5449;
}

Role tokens

Use these in CSS when colors are assigned to practical jobs like text, buttons, borders, links, and backgrounds.

Use when: you need UI roles, not just swatches.
:root {
  --role-logo: #D8B7B4;
  --role-link: #D8B7B4;
  --role-btn-primary-bg: #D8B7B4;
  --role-btn-secondary-bg: #9CAD99;
  --role-btn-outlined-border: #9CAD99;
  --role-btn-outlined-text: #9CAD99;
  --role-headline: #CBB9A3;
  --role-icon: #B9B6B1;
  --role-border: #B9B6B1;
  --role-divider: #B9B6B1;
  --role-outline: #B9B6B1;
  --role-bg-light: #E7D9CA;
  --role-bg-dark: #FFFFFF;
  --role-text: #5B5449;
  --role-btn-primary-text: #5B5449;
  --role-btn-secondary-text: #5B5449;
}

JSON

Use this structured palette data in apps, generators, plugins, or tools that need to read the palette programmatically.

Use when: a developer or app needs data.
{
    "muted-blush": "#D8B7B4",
    "soft-sage": "#9CAD99",
    "creamy-taupe": "#CBB9A3",
    "soft-silver": "#B9B6B1",
    "warm-beige": "#E7D9CA",
    "pure-white": "#FFFFFF",
    "near-white": "#F9F6F4",
    "deep-taupe": "#5B5449"
}
Press Space to load new palette