Palette

Coastal Pottery Glaze

Reflects the handcrafted beauty of pottery found by the sea, with weathered, earthy tones.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Coastal Pottery Glaze 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 Coastal Pottery Glaze.

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

Data visualization

#D9CBB7#8BA39F#5D727C#A4A48A#F5EFDF

Palette guide

How to use Coastal Pottery Glaze

Overview

The Coastal Pottery Glaze palette reflects the handcrafted beauty of pottery found by the sea, with weathered, earthy tones and hints of muted blue-green. Featuring the creamy #F5EFDF and #D9CBB7, complemented by the artisanal #8BA39F and #A4A48A, and grounded by the deep #5D727C. This palette is perfect for designs that evoke a rustic, natural, and serene aesthetic. Developers will find these colors excellent for crafting artisan brand identities, natural home goods websites, and inviting digital experiences that feel both organic and sophisticated.

Best used for

Artisan craft and ceramic studios
Natural home goods and decor brands
Rustic and vintage-inspired designs
Eco-friendly product packaging
Serene lifestyle blogs and websites
Content with textured aesthetics

Suggested color roles

primary

Utilize #D9CBB7 as a warm, inviting primary color for main sections, headers, or card backgrounds.

secondary

Employ #8BA39F for secondary information, navigation, or to introduce a subtle, muted blue-green contrast.

accent

Apply #5D727C sparingly for strong text, important icons, or as a deep footer/header color to provide grounding and depth.

background

The lightest shade, #F5EFDF, is ideal for expansive backgrounds, offering a soft, natural, and clean canvas.

text

For optimal readability on lighter backgrounds, use #5D727C or a dark brown like #4C3E2D to ensure clear text presentation.

Accessibility notes

Ensure #5D727C text has sufficient contrast against #F5EFDF or #D9CBB7 backgrounds.
Avoid using #D9CBB7 or #A4A48A for small text on #F5EFDF, as contrast may be too low for readability.
Always test all text and interactive elements with a WCAG contrast checker for compliance.
This palette's softer tones require careful contrast checks, especially for body text.

Recommended combinations

Glazed Finish

Excellent for layered content blocks or a soft background with complementary warm and muted blue-green tones.

#F5EFDF · #D9CBB7 · #8BA39F

Rustic Depth

Create a sense of depth and hierarchy in UI elements, moving from a muted blue-green to a deeper, grounding shade.

#8BA39F · #5D727C · #A4A48A

Earthy Accent

Use a light background with an earthy accent color for emphasis, balanced by a warm, natural primary shade.

#F5EFDF · #A4A48A · #D9CBB7

CSS variables

:root {
  --coastal-pottery-glaze-1: #D9CBB7;
  --coastal-pottery-glaze-2: #8BA39F;
  --coastal-pottery-glaze-3: #5D727C;
  --coastal-pottery-glaze-4: #A4A48A;
  --coastal-pottery-glaze-5: #F5EFDF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "coastal-pottery-glaze": {
        1: "#D9CBB7",
        2: "#8BA39F",
        3: "#5D727C",
        4: "#A4A48A",
        5: "#F5EFDF",
      }
    }
  }
}

Hex values

Color 1#D9CBB7

Color 2#8BA39F

Color 3#5D727C

Color 4#A4A48A

Color 5#F5EFDF

Accessibility

Contrast checker

1.7:1Fail

3.2:1AA18

1.6:1Fail

1.4:1Fail

1.7:1Fail

1.9:1Fail

1.1:1Fail

2.3:1Fail

3.2:1AA18

1.9:1Fail

2:1Fail

4.4:1AA18

1.6:1Fail

1.1:1Fail

2:1Fail

2.2:1Fail

1.4:1Fail

2.3:1Fail

4.4:1AA18

2.2:1Fail

Similar palettes

More like Coastal Pottery Glaze

View all earth

Aegean Cliffside Home