exoticthe kit

The kit

Every part the product is built from, live and at true size — press and hover them. One implementation each; if a piece is here, nothing should draw it twice. The reasoning lives in docs/DESIGN.md.

Buttons & actions

Controls

Data & identity

Surfaces & overlays

States

Trade widget

PerpetualTradeWidget.mount(el, {kind:'perp'})

Sized in dollars, not contracts. Leverage reads out as effective leverage while you type, and the liquidation sentence is concrete before you commit. The header is shown here to specimen it; app pages pass showHeader:false because the page already names the asset.

Spot{kind:'spot'}

The same surface with the leverage machinery gone — a plain buy and sell.

Story kit

the parts · design language · brand styles css/kit/ · builders js/kit/