Thematic Season Specimen

What Thematic is

Thematic turns seasonal color forecasts into interface tokens. It holds ten researched themes, five for autumn/winter 26/27 and five for spring/summer 27. Each one carries the agencies' swatches, the seed roles chosen from them, light and dark UI tokens, checked contrast pairs, pairings to avoid and how the color story shifts between seasons.

Five of the ten themes are loaded here. Pick one above and the whole page, including its display typeface, re-inks from that theme's tokens.

Forecast swatches · select one

What is driving it

How a forecast becomes a UI

Three layers, each with a different job

A swatch that works on a mood board can fail as text. Thematic keeps the forecast color, the chosen seed and the shipped UI value separate, so you can see where a tone was moved to pass contrast.

1 · Colors

Forecast swatches

What agencies such as Pantone, WGSN × Coloro, Sherwin-Williams and Dulux published, each labelled with how its hex was obtained.

2 · Roles

Seed roles

One swatch is picked for primary, secondary, tertiary, neutral and surface. Proxies and borrowed colors are named as such.

3 · Tokens

UI values

Light and dark tokens with paired on-* colors. Where a seed fails WCAG, its tone is adjusted and the before and after ratios are recorded.

Live specimen

The tokens on a working screen

A booking page for a ceramics studio, built only from this theme's tokens. Turn on the token map to see which pair paints each part. Every status message carries an icon and a word, so meaning never rests on color alone.

Show token map

Saltglaze Studio

Evening course · 6 weeks

Wheel throwing for people who have never touched clay

Six Tuesday evenings at the wheel, from centring to trimming. You leave with four glazed pieces and a firm opinion about porcelain. Read the kiln schedule before you book.

Beginner Materials included 4 seats left

Seats booked this term

Reserve a seat

Full name

Email Add the domain ending, for example .com

Start date Classes run 18:30–21:00.

Booked. Your seat for 12 January is confirmed.

Kiln delay. Bisque firing moves to Thursday this week.

Payment failed. Check the card number and try again.

Aprons provided. Wear clothes that can take a splash.

Status colors come from IBM Carbon and stay semantic in every theme; only their tones are adjusted per surface. Specimen copy is invented

Pairing lab

Check any two tokens against each other

Pick a text token and a background token from the current theme and mode. The ratio is computed in your browser with the WCAG 2.2 formula and compared unrounded against each threshold.

Text token

Background token

Try

Contrast ratio

Glaze the inside first

Body copy at 17 px needs 4.5:1. Large text, 24 px or 18.66 px bold, needs 3:1. A border or icon that carries meaning also needs 3:1 against what sits next to it.

Recorded contrast pairs

What the research checked

These are the exact pairs the corpus verified for this theme and mode, recomputed here. A pair not on this list, or the same pair on a different background, needs its own check.

Purpose	Text	Background	Sample	Ratio	Needs	Result

Pairings to avoid

Different hues, almost the same lightness

These forecast colors look distinct on a mood board but sit at nearly the same luminance. Text or thin lines in one on the other are hard to read. The samples below are deliberately low contrast.

Seasonal dynamics

How color families move from autumn/winter 26/27 into spring/summer 27, read from this theme's side. This describes the forecast, not an animation. A family counts as continuing when its nearest match in the other season is within CIEDE2000 15.

Usage proportions

How much is hero color

Editorial Apply these shares to the chromatic, non-surface parts of a screen, such as actions, highlights and charts. They describe the color story, not how much of a page should be tinted.

Provenance labels

Where each hex comes from

official: The owner published this digital value.
third-party: An independent sRGB rendering. The owner's value is gated or paid.
computed: Derived from published colorimetry. Not an official hex.
estimated: A visual estimate with no published colorimetry. Match against a physical standard before production.
proxy: A nearby published color standing in for an unpublished one.
adjusted: A UI tone moved to pass contrast. It keeps the seed's provenance.

Use it

Ask for a theme by name

In Claude Code, run /thematic with a request such as “apply Rewild to our booking form in dark mode”. It returns the token pairs for each component, what to keep and change, and the cautions for that theme. The helper script answers color questions directly.