design preview

Primitives and composition

Every primitive in the design system, rendered in the active theme. Toggle theme from the nav.

01

Color tokens

surface
surface-alt
border
text
dim
primary
accent
accent-soft
warn
warn-soft
danger
danger-soft
02

Primitives

LogoBeaker
Hand-authored SVG, currentColor.
StatusPill
6 states, lives in Cell header.
idlereadyrunningpassfailwarn
CaveatPill
Caveat key=value, three satisfier states.
expires=2026-01-01T00:00:00Zip=10.0.0.1method=POST
Chip
Neutral kicker labels.
L402LSATmainnetscheme=L402
ViewModeToggle
raw | json | code segmented control.
TruncMiddle
Fixed-width identifier with hover tooltip.
BigBlob
Long mono value, copy + wrap toggles.
Generated value
254 chars
MDAxYWxvY2F0aW9uIGxzYXQuYm9sdHdhbGwuaW8KMDAyNGlkZW50aWZpZXIgYjEyM2YwMDljYWZlYmFiZTU1NTU2NjY2N2YwMQowMDIzY2lkIGV4cGlyZXM9MjAyNi0wMS0wMVQwMDowMDowMFoKMDAxYWNpZCBpcD0xMC4wLjAuMQowMDJmc2lnbmF0dXJlIDdkOWMxMzMyZmFhZGRlY2FmZTk5OTljYWZlZGVhZGJlZWY1NTY2NzcwMDhkCg
CodeStrip
Visible when Cell view = code.
// rendering preview — production highlighting uses Prism
const token = await client.build({
  preimage,
  macaroon,
});
HeaderRow
Title · subtitle · trailing slot.
Parse a tokenraw · base64
ready
Cell
The only top-level container.
Inspect identifier32 bytes
parsed
Identifier
03

MacaroonStripe

4-segment macaroon visualization. Click a segment to reveal raw bytes.

identifier
location
caveat 1
caveat 2
signature
04

CodeSnippet

Live-updating syntax-highlighted snippet. Type in the field to see the template update.

typescriptcurrent input code - reflects form fields
import { L402 } from "@boltwall/l402";
// Build an L402 Authorization header
const token = new L402({
macaroons: "AgEDbHRu…",
paymentPreimage: "0001020304…",
});
const header = token.toAuthorizationHeader();
05

Composite — Validate a token

Validate a tokensignature · expiration · caveats
3 / 5 passed
Checks
pass
Signature verified
HMAC-SHA256 over canonical bytes
pass
Preimage matches payment hash
sha256(preimage) == payment_hash
pass
Not expired
expires=2026-01-01T00:00:00Z
warn
Token size within limit
612 / 1024 bytes
fail
All caveats satisfied
1 caveat unsatisfied: ip=10.0.0.1
Caveats
expires=2026-01-01T00:00:00Zip=10.0.0.1method=GETtier=pro