Phase 0 review

UK SEX TOYS design system

Six named colours, three type families, one radius scale. Components reference semantic tokens only — no hex values and no default shadcn styling anywhere in the storefront.

Dark mode

Brand palette

Exactly six colours. Anything not on this list is a bug.

--ink

Text, headers, footer

--veil

Page background

--orchid

Primary — buttons, links, brand

--jade

Trust, safety, in stock

--periwinkle

Surfaces, cards, menu panels

--blush

Accent only — badges, highlights

Semantic tokens

What components actually reference. Both light and dark values are defined.

background

foreground

card

primary

secondary

muted

accent

destructive

border

ring

Type scale

Fraunces for display, Plus Jakarta Sans for body and interface, IBM Plex Mono for specifications.

text-displayDisplay

text-h1Heading one

text-h2Heading two

text-h3Heading three

text-h4Heading four

text-bodyBody — silicone, 168 mm total length.

text-smallSmall — care and shipping notes.

text-microMicro — labels and eyebrows.

font-monoSKU MDS-0142 · 34 mm Ø

Spacing, radius, elevation

Spacing

Radius

rounded-sm

rounded-md

rounded-lg

rounded-xl

rounded-2xl

rounded-3xl

Elevation

shadow-soft

shadow-lifted

shadow-panel

Buttons

Focus rings are 2px with 2px offset on every variant. Tab through to check.

Forms

Labels are always visible. Errors are tied with aria-describedby and phrased as the fix.

Email address

Sort results

Material

Medical-grade silicone

Borosilicate glass

Experience

First time

Tried one or two

Insertable length

Up to 120 millimetres insertable

Surfaces and badges

Product card surface

Medical-grade silicone · rechargeable · waterproof

New

Beginner friendly

Waterproof

In stock

Last one

Overlays and disclosure

Escape closes, focus is trapped, focus returns to the trigger. The age gate is the deliberate exception.

Material: Medical-grade silicone
Total length: 168 mm
Max diameter: 34 mm