Back to palettes

Palette

Porcelain Garden Path

Smooth, refined tones of aged porcelain and light stone, creating a serene, elegant garden path.

neutralelegant5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Porcelain Garden Path reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Porcelain Garden Path.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#F5F5DC#E0E0CE#C8C8B5#B0B09A#98987F

Palette guide

How to use Porcelain Garden Path

Overview

The Porcelain Garden Path palette offers a serene and elegant collection of soft, aged neutral tones, perfect for creating sophisticated digital and physical spaces. Inspired by weathered porcelain and light stone, this palette features hues like the gentle cream of #F5F5DC, the subtle warmth of #E0E0CE, and the deeper, grounding shade of #B0B09A. Designers can leverage its understated beauty for a refined aesthetic, while developers will appreciate the consistency for subtle UI elements or background textures. It's ideal for projects aiming for a calm, timeless, and understated luxury feel, providing a harmonious base that feels both natural and polished.

Best used for

  • Elegant website backgrounds and UI elements
  • Luxury brand identity and packaging
  • Serene interior design concepts
  • High-end editorial layouts and typography
  • Wedding invitations and stationery
  • Gentle e-commerce product displays

Suggested color roles

primary

#F5F5DC - Ideal for expansive backgrounds, large content blocks, or a primary base for a delicate interface, offering a luminous yet soft foundation.

secondary

#E0E0CE - Excellent for secondary content areas, card backgrounds, or subtle section dividers, providing a slightly more grounded feel than the primary.

accent

#98987F - Use sparingly for subtle accents, hover states, or small icons to add depth without overwhelming the delicate overall tone.

background

#F5F5DC - Provides a clean, airy canvas. For a slightly warmer, more substantial background, consider #E0E0CE.

text

For light backgrounds like #F5F5DC or #E0E0CE, a dark charcoal or black text (e.g., #333333) ensures readability. For darker elements like #98987F, crisp white text is recommended.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially with lighter shades like #F5F5DC.
  • Use a color contrast checker for all text-on-background combinations to meet WCAG standards.
  • Darker shades like #98987F may require white or very light text for optimal readability.
  • Avoid using similar light tones for interactive elements to prevent confusion for users with low vision.

Recommended combinations

Soft Serenity

A classic base for elegant websites or print materials, offering a gentle contrast.

#F5F5DC · #E0E0CE · #98987F

Earthy Whisper

Great for layered backgrounds or subtle visual hierarchy in sophisticated interfaces.

#E0E0CE · #C8C8B5 · #B0B09A

Garden Stone

Provides a more grounded, natural feel, suitable for footer designs or textural elements.

#C8C8B5 · #B0B09A · #98987F

CSS variables

:root {
  --porcelain-garden-path-1: #F5F5DC;
  --porcelain-garden-path-2: #E0E0CE;
  --porcelain-garden-path-3: #C8C8B5;
  --porcelain-garden-path-4: #B0B09A;
  --porcelain-garden-path-5: #98987F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "porcelain-garden-path": {
        1: "#F5F5DC",
        2: "#E0E0CE",
        3: "#C8C8B5",
        4: "#B0B09A",
        5: "#98987F",
      }
    }
  }
}

Related searches

elegant neutral color schemesoft gray green palettesophisticated beige hex codestimeless porcelain colorssubtle garden path design

Palette colors

Hex values

Color 1#F5F5DC
·
Color 2#E0E0CE
·
Color 3#C8C8B5
·
Color 4#B0B09A
·
Color 5#98987F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
2:1Fail
2.7:1Fail
2
1.2:1Fail
1.3:1Fail
1.7:1Fail
2.2:1Fail
3
1.5:1Fail
1.3:1Fail
1.3:1Fail
1.7:1Fail
4
2:1Fail
1.7:1Fail
1.3:1Fail
1.3:1Fail
5
2.7:1Fail
2.2:1Fail
1.7:1Fail
1.3:1Fail

Similar palettes

More like Porcelain Garden Path

View all neutral
Silk Gown Drape
Ancient Calligraphy Ink
Ancient Marble Ruins
Ancient Marble Veins
Art Deco Elegance
Boulevard Grey