Skip to main content

A little color. A new perspective.

Published Aug 21, 2026

The Closet Returns to Order

Test in Color Lab

Five colors, endless possibilities. Select a color to copy its HEX.

A minimal autumn wardrobe palette of charcoal shelving, soft white type, cool gray fabric, porcelain labels, and one muted cyan selection stitch.

The feeling

An orderly autumn closet of charcoal shelves, folded fabric, care labels, and one teal selection stitch

Explore this palette ↓

The mood

The last warm-weather pieces have been folded away, leaving one garment on each charcoal shelf. Soft Chalk keeps the closet list calm and readable, while Folded Gray gives sweaters, trousers, and outfit groups the quiet weight of neatly stacked fabric.

Porcelain Tag turns care notes into small paper-like panels. Teal Stitch appears only at the selected item, echoing the colored thread on an inventory label without disturbing the disciplined shelf.

How to use it

Build the main wardrobe view on Charcoal Shelf and set navigation, garment names, counts, and essential care instructions in Soft Chalk. Use Folded Gray for folded-fabric cards and secondary grouping bars, then reserve Porcelain Tag for expanded care notes or a compact seasonal checklist.

Apply Teal Stitch to the selected-item marker, a short status rule, or one active filter. Start with 68% Charcoal Shelf, 24% Folded Gray, and 8% Porcelain Tag; keep the cyan stitch small enough to feel like a useful marker rather than decoration.

What to watch

Soft Chalk reaches 13.33:1 on Charcoal Shelf, 4.84:1 on Folded Gray, and 4.76:1 on Teal Stitch, so all three support normal-size AA text. On Porcelain Tag it measures only 1.25:1 and fails both normal and large text. Switch to Charcoal Shelf text on porcelain panels for 10.68:1.

Folded Gray and Teal Stitch are close in value at 1.02:1, so never use their boundary alone to show which garment is selected. Add the cyan stitch inside a charcoal or porcelain container and pair it with a checkmark or a written selected state.

A considered balance

Make room for
the right colors.

Use Charcoal Shelf for the main app field, Soft Chalk for essential copy, Folded Gray for garment cards, Porcelain Tag for care-note panels, and Teal Stitch for the selected-item marker. Set Charcoal Shelf text on porcelain surfaces.

Start with a generous background, introduce your primary color, then use the highlight sparingly. The ratios are a guide for large surfaces, not a fixed recipe.

68 Base
24 Main
8 Point
Charcoal Shelf

Background & breathing room

Folded Gray

Cards, graphics & sections

Porcelain Tag

Buttons & key signals

Background · Primary · Highlight. Use text and accent colors where their roles call for them.

Text on background
13.33:1 #ECEDEC on #202426 · AAA normal text
Text on primary
4.84:1 #ECEDEC on #60686C · AA normal text
Text on highlight
1.25:1 #ECEDEC on #D8D5CE · Not suitable for text

The original text has low contrast (1.25:1). This example uses Charcoal Shelf (#202426) from the same palette instead of #ECEDEC on #D8D5CE, improving contrast to 10.68:1. This meets WCAG AA for normal text.

Text on accent
4.76:1 #ECEDEC on #3E7071 · AA normal text

Contrast is calculated for these specific pairs. Large text means at least 24 px regular or about 18.7 px bold. Check every pairing in your final design.

IMAGINE THE POSSIBILITIES

One palette.
A world of possibilities.

See how these five colors come together in a website, a poster, a brand, and a presentation. Explore a different palette and watch the mood change.

ONDA STUDIO / WEB PREVIEW
Journal   Places   About

INDEPENDENT STUDIO · SEOUL

Design with
today’s color.

A little space for fresh ideas. A considered palette for whatever comes next.

Prepared design previews, recolored with this palette.

COLOR NOTE

Soft Chalk on Porcelain Tag is only 1.25:1 and fails normal and large text. Use Charcoal Shelf text there at 10.68:1. Folded Gray and Teal Stitch are only 1.02:1 apart, so their boundary cannot carry selection meaning without a charcoal or porcelain container plus a checkmark or label.

From inspiration to creation

Your next idea,
in these colors.

Add a considered color direction to the design you already have in mind. Your layout and instructions stay yours.

  1. Write your design request.
  2. Choose a color guide and copy it.
  3. Paste it after your request.
  4. Review the result and check readability.

Try it in the design or AI tool you already use.

[Color guide — coloring.today / the-closet-returns-to-order]
Apply this palette to the design requested above. Preserve the requested layout, content, and interactions. If an explicit requirement conflicts with this color guide, identify the conflict instead of silently overriding it.

Text: Soft Chalk #ECEDEC
Primary: Folded Gray #60686C
Highlight: Porcelain Tag #D8D5CE
Accent: Teal Stitch #3E7071
Background: Charcoal Shelf #202426

Mood: An orderly autumn closet of charcoal shelves, folded fabric, care labels, and one teal selection stitch
Suggested uses: Lifestyle apps
Application note: Use Charcoal Shelf for the main app field, Soft Chalk for essential copy, Folded Gray for garment cards, Porcelain Tag for care-note panels, and Teal Stitch for the selected-item marker. Set Charcoal Shelf text on porcelain surfaces.
Avoid: Soft Chalk on Porcelain Tag is only 1.25:1 and fails normal and large text. Use Charcoal Shelf text there at 10.68:1. Folded Gray and Teal Stitch are only 1.02:1 apart, so their boundary cannot carry selection meaning without a charcoal or porcelain container plus a checkmark or label.
Use approximately 68% background, 24% primary, and 8% highlight across large surfaces. These ratios are a starting point, not a rigid rule. Use text and accent colors according to their roles.

Keep the original HEX values. Choose readable text/background pairings without silently changing the palette. Do not introduce unrelated colors.
[Color guide — coloring.today / the-closet-returns-to-order]
Apply this palette to the design requested above. Preserve the requested layout, content, and interactions. If an explicit requirement conflicts with this color guide, identify the conflict instead of silently overriding it.

Text: Soft Chalk #ECEDEC
Primary: Folded Gray #60686C
Highlight: Porcelain Tag #D8D5CE
Accent: Teal Stitch #3E7071
Background: Charcoal Shelf #202426

Mood: An orderly autumn closet of charcoal shelves, folded fabric, care labels, and one teal selection stitch
Suggested uses: Lifestyle apps
Application note: Use Charcoal Shelf for the main app field, Soft Chalk for essential copy, Folded Gray for garment cards, Porcelain Tag for care-note panels, and Teal Stitch for the selected-item marker. Set Charcoal Shelf text on porcelain surfaces.
Avoid: Soft Chalk on Porcelain Tag is only 1.25:1 and fails normal and large text. Use Charcoal Shelf text there at 10.68:1. Folded Gray and Teal Stitch are only 1.02:1 apart, so their boundary cannot carry selection meaning without a charcoal or porcelain container plus a checkmark or label.
Use approximately 68% background, 24% primary, and 8% highlight across large surfaces. These ratios are a starting point, not a rigid rule. Use text and accent colors according to their roles.

Use these semantic tokens consistently. Keep the original HEX values.
:root {
  --color-text: #ECEDEC;
  --color-primary: #60686C;
  --color-highlight: #D8D5CE;
  --color-accent: #3E7071;
  --color-background: #202426;
}
Background is the canvas, text is readable copy, primary is a key surface, highlight draws attention, and accent adds small secondary details.
[Color guide — coloring.today / the-closet-returns-to-order]
Apply this palette to the design requested above. Preserve the requested layout, content, and interactions. If an explicit requirement conflicts with this color guide, identify the conflict instead of silently overriding it.

Text: Soft Chalk #ECEDEC
Primary: Folded Gray #60686C
Highlight: Porcelain Tag #D8D5CE
Accent: Teal Stitch #3E7071
Background: Charcoal Shelf #202426

Mood: An orderly autumn closet of charcoal shelves, folded fabric, care labels, and one teal selection stitch
Suggested uses: Lifestyle apps
Application note: Use Charcoal Shelf for the main app field, Soft Chalk for essential copy, Folded Gray for garment cards, Porcelain Tag for care-note panels, and Teal Stitch for the selected-item marker. Set Charcoal Shelf text on porcelain surfaces.
Avoid: Soft Chalk on Porcelain Tag is only 1.25:1 and fails normal and large text. Use Charcoal Shelf text there at 10.68:1. Folded Gray and Teal Stitch are only 1.02:1 apart, so their boundary cannot carry selection meaning without a charcoal or porcelain container plus a checkmark or label.
Use approximately 68% background, 24% primary, and 8% highlight across large surfaces. These ratios are a starting point, not a rigid rule. Use text and accent colors according to their roles.

Text/background contrast: 13.33:1. This is one measured pair, not a guarantee for the whole palette. Check every actual text/background pairing against WCAG AA. Prefer readable combinations from the original colors, keep visible keyboard focus, and never communicate state through color alone. If no original pairing meets the requirement, propose a separately labeled derived color with its original HEX, proposed HEX, purpose and measured contrast. Never overwrite the source palette.

This guide preserves the original HEX values. Review the output before using it.

Bring it into your project

Five colors.
Ready to use.

Copy the same colors as semantic CSS variables. Every preview and prompt on this page uses this palette.

:root {
  --color-text: #ECEDEC;
  --color-primary: #60686C;
  --color-highlight: #D8D5CE;
  --color-accent: #3E7071;
  --color-background: #202426;
}

A little more inspiration.

All palettes ↗

Copy your color guide

Your browser could not copy automatically. Select the text below and copy it.