WEB AWESOME / TOKEN WORKBENCH

See the theme cross the component boundary.

Change a scoped token and inspect native custom elements alongside ordinary HTML.

Theme controls

Square / 0

Default / 1

Rounder / 2

Compact / 0.8

Default / 1

Relaxed / 1.25

Dark appearance

Restore defaults

These controls change only the specimen. The editing controls keep their original dimensions.

COMPONENT PREVIEWFree components

Form labels, field borders and actions inherit semantic tokens through the shadow boundary.

Europe

North America

Asia Pacific

Apply name locally

Invite later

No workspace is created by this specimen.

--wa-border-radius-scale: 1;
--wa-space-scale: 1;