Powder and Ink
Beauty, soft, elegant · Aesthetary’s guidance, not research
Soft without being sweet: a powder ground, black type and one bottle green.
Suggested proportions
- 58% Canvas
- 18% Surface
- 12% Text
- 5% Primary action
- 4% Muted text
- 3% Accent
In use
Facials that take an hour, not a sales pitch.
We tell you what we’d skip.
Book a facialRead the menu
New: the barrier facial
60 minutes. For dry, reactive skin.
Skin concerns
Tell us one concern so we can prepare.
See you on Thursday at 4pm.
Using it well
21 color pairs are approved for use. 4 pairs are not for text. Each is listed under Contrast, by use.
Roles
14 colors, their HEX values, what each is for and where it comes from
| Role | Color | Use | Where it comes from |
|---|---|---|---|
| Canvas | #EEEBE7 | The page ground. | Aesthetary’s guidance |
| Surface | #F8F7F5 | Cards, panels and fields. | Aesthetary’s guidance |
| Text | #161414 | All reading text and headings. | Aesthetary’s guidance |
| Muted text | #5A5552 | Secondary text and captions. | Aesthetary’s guidance |
| Primary action | #161414 | The primary action, and links where it passes as text. | Aesthetary’s guidance |
| Text on primary | #F8F7F5 | Label on the primary action. | Aesthetary’s guidance |
| Secondary action | #161414 | Secondary action: label and outline. | Aesthetary’s guidance |
| Border | #D3CEC9 | Hairlines and dividers. Decorative only; never a field’s only edge. | Aesthetary’s guidance |
| Input border | #847E7A | The edge of an input, where it is the only boundary. | Aesthetary’s guidance |
| Accent | #2E5E4E | Bottle green: “new” or “limited”, a word in color. Never decoration. | Aesthetary’s guidance |
| Focus | #161414 | Focus ring, 2px, offset from the control. | Aesthetary’s guidance |
| Success | #1B7442 | Confirmation, always with a word or icon. | Aesthetary’s guidance |
| Warning | #8A5A00 | Warnings, always with a word or icon. | Aesthetary’s guidance |
| Error | #B3261E | Errors, always with a word or icon. | Aesthetary’s guidance |
Contrast, by use
21 approved pairs, all passing · 4 not for text
WCAG 2 ratios, computed from the colors. Text needs 4.5:1; large text (24px, or 18.66px bold) and non-text (a focus ring, a field’s only edge, an icon) need 3:1. Only the pairs listed as approved are recommended.
Approved pairs
| Pair | Contrast | Needs | For | Result |
|---|---|---|---|---|
| Text on Canvas | 15.44:1 | 4.5:1 | TextReading text | Passes |
| Text on Surface | 17.14:1 | 4.5:1 | TextReading text | Passes |
| Muted text on Canvas | 6.19:1 | 4.5:1 | TextSecondary text, captions | Passes |
| Muted text on Surface | 6.87:1 | 4.5:1 | TextSecondary text, captions | Passes |
| Text on primary on Primary action | 17.14:1 | 4.5:1 | TextLabel on the primary action | Passes |
| Secondary action on Canvas | 15.44:1 | 4.5:1 | TextSecondary action: label and outline | Passes |
| Secondary action on Surface | 17.14:1 | 4.5:1 | TextSecondary action: label and outline | Passes |
| Primary action on Canvas | 15.44:1 | 4.5:1 | TextLinks and small text in the action color | Passes |
| Primary action on Surface | 17.14:1 | 4.5:1 | TextLinks and small text in the action color | Passes |
| Focus on Canvas | 15.44:1 | 3:1 | Non-text (3:1)Focus ring | Passes |
| Focus on Surface | 17.14:1 | 3:1 | Non-text (3:1)Focus ring | Passes |
| Input border on Canvas | 3.37:1 | 3:1 | Non-text (3:1)Input edge, the only boundary of a field | Passes |
| Input border on Surface | 3.74:1 | 3:1 | Non-text (3:1)Input edge, the only boundary of a field | Passes |
| Success on Canvas | 4.88:1 | 4.5:1 | TextStatus message, always with a word or icon | Passes |
| Success on Surface | 5.41:1 | 4.5:1 | TextStatus message, always with a word or icon | Passes |
| Warning on Canvas | 4.99:1 | 4.5:1 | TextStatus message, always with a word or icon | Passes |
| Warning on Surface | 5.54:1 | 4.5:1 | TextStatus message, always with a word or icon | Passes |
| Error on Canvas | 5.50:1 | 4.5:1 | TextStatus message, always with a word or icon | Passes |
| Error on Surface | 6.11:1 | 4.5:1 | TextStatus message, always with a word or icon | Passes |
| Accent on Canvas | 6.25:1 | 4.5:1 | TextAccent text | Passes |
| Accent on Surface | 6.94:1 | 4.5:1 | TextAccent text | Passes |
Not for text
- Border on Canvas 1.31:1. Not for text. Fill or decoration only. Under 3:1: a fill or decoration only. Never text, an icon or a field’s only edge.
- Border on Surface 1.46:1. Not for text. Fill or decoration only. Under 3:1: a fill or decoration only. Never text, an icon or a field’s only edge.
- Input border on Canvas 3.37:1. Not for text. Non-text only. An edge or ring, not a text color.
- Input border on Surface 3.74:1. Not for text. Non-text only. An edge or ring, not a text color.
What makes it characteristic
The products and the skin carry the color; the page stays exact. A cool powder ground keeps it soft, black type keeps it precise, and a single bottle green marks what is new or limited.
Avoids: Blush pink with a thin serif; rose gold.
Limits of this palette
- Shade names on products must be written out: never show a shade by its swatch alone.
Related
Shares a principle with (Aesthetary’s guidance)Editorial Modernism, Japanese Minimalism
Related palettesUnbleached, Black Blade, Cellar, Late Edition