One row per shape role. Everything in a row reads the same token, so a single declaration reshapes all of it. Append ?shape_theme=brutal or ?shape_theme=soft to this URL to see the whole page change without a single component selector.

--control-radius

Buttons, fields, badges, menu items, pagination links — anything you click or type into.

button
input
select
textarea
Badge badge
toggle group
pagination link
menu item

--surface-radius

Cards, alerts, popovers, toasts, tables — anything that holds other things. 0.5rem in 0.6.0; card and the sidebar inset were 12px before.

Card

Surface

card
Alert
alert
Table
table container

Revenue

$12,400

+4.2%

stats card

Empty

empty
Dropdown and combobox popovers
popover surface

--mark-radius

The checkbox box. 4px by default, which is neither a control nor a surface.

unchecked
checked
indeterminate

--pill-radius

Fully round by default: the radio and the switch track.

radio
switch off
switch on

Focus ring

--focus-ring-width / --focus-ring-offset / --focus-ring-style. An outline, so it never disturbs layout and never gets clipped.

button
input
checkbox
switch
Badge badge