Vawe
block registry

96 blocks, ready to compose.

A vetted, deterministic component library — charts, cards, code, terminals, KPIs, browser frames — that you drop into a scene. Every block is theme-aware: it reskins to any brand.

44 families · drop into a scene with { "block": "…" } · reskins to your theme
card
card
card
elevated card · tinted panel · pill tags · CTA arrow
codeBlock
codeBlock
codeBlock
code card; syntax-coloured lines
terminal
terminal
terminal
command prompt; command decodes in, output reveals
loadingBar
loadingBar
loadingBar
determinate fill wipes L→R, lands ✓ done
deploySuccess
deploySuccess
deploySuccess
CI cascade → green "Deployed to production" card
browserFrame
browserFrame
browserFrame
window chrome (traffic dots + URL bar)
pillRow
pillRow
pillRow
horizontal row of chip tags
statBig
statBig
statBig
scale-contrast stat — huge count + tiny label
colorCycle
colorCycle
colorCycle
one word cycling through hues
stripeCard
stripeCard
stripeCard
recognizably-Stripe payments card
barChart
barChart
barChart
labeled bars scaled to max
diff
diff
diff
code diff card (+/- coloured)
quote
quote
quote
pull quote + attribution
notification
notification
notification
toast card (dot + title + body)
kpiRow
kpiRow
kpiRow
row of stat cells (value + label)
callout
callout
callout
info/success/warn strip
comparison
comparison
comparison
two columns (Before/After · Others/Us)
codeBlock.light
codeBlock.light
codeBlock
code card, light surface
callout.info
callout.info
callout
info strip (blurple)
callout.warn
callout.warn
callout
warning strip (terracotta)
comparison.beforeAfter
comparison.beforeAfter
comparison
Before / After columns
notification.warn
notification.warn
notification
toast, amber accent
statBig.currency
statBig.currency
statBig
stat with a $ unit
lineChart
lineChart
lineChart
trend line in a hairline card
lineChart.area
lineChart.area
lineChart
trend line with area fill
donutChart
donutChart
donutChart
ring segments + legend
stackedBar
stackedBar
stackedBar
multi-series stacked bars
card.pricing
card.pricing
pricingCard
plan · price · features · CTA
card.stat
card.stat
statCard
boxed KPI with delta chip
card.profile
card.profile
profileCard
avatar · name · role
fileTree
fileTree
fileTree
indented file/folder tree
logLines
logLines
logLines
log stream (timestamp + level colour)
logLines.light
logLines.light
logLines
log stream on a light surface
commitRow
commitRow
commitRow
git history list
phoneFrame
phoneFrame
phoneFrame
phone shell (draw content on top)
tabBar
tabBar
tabBar
segmented control
checklist
checklist
checklist
checked / unchecked items
table
table
table
data table (header + rows)
timeline
timeline
timeline
vertical rail of events
stepFlow
stepFlow
stepFlow
horizontal numbered steps
kanban
kanban
kanban
columns of cards
chatBubble
chatBubble
chatBubble
a message thread
tweetCard
tweetCard
tweetCard
a post card + counts
avatarStack
avatarStack
avatarStack
overlapping avatars + overflow
toast
toast
toast
dark snackbar + action
reactionBar
reactionBar
reactionBar
reaction count pills
logoWall
logoWall
logoWall
grid of wordmarks / logos
badge
badge
badge
CI-shield token (label · value)
badge.version
badge.version
badge
version badge
gauge
gauge
gauge
semicircular meter
progressRing
progressRing
progressRing
circular progress + % label
banner
banner
banner
accent announcement bar
spinner
spinner
spinner
looping Lottie (deterministic)
codeBlock.py
codeBlock.py
codeBlock
code card, python
terminal.git
terminal.git
terminal
git command
terminal.install
terminal.install
terminal
install command
diff.config
diff.config
diff
config diff
barChart.green
barChart.green
barChart
bars in success green
lineChart.down
lineChart.down
lineChart
declining trend (red)
donutChart.two
donutChart.two
donutChart
two-segment ring
stackedBar.three
stackedBar.three
stackedBar
three-series stack
gauge.warn
gauge.warn
gauge
gauge, low (amber)
gauge.full
gauge.full
gauge
gauge, complete (green)
progressRing.done
progressRing.done
progressRing
ring, 100% (green)
progressRing.low
progressRing.low
progressRing
ring, low (amber)
kpiRow.money
kpiRow.money
kpiRow
KPI row, currency
statBig.time
statBig.time
statBig
stat, ms unit
card.stat.down
card.stat.down
statCard
KPI card, negative delta
card.stat.plain
card.stat.plain
statCard
KPI card, no delta
card.pricing.free
card.pricing.free
pricingCard
pricing, free tier
card.pricing.team
card.pricing.team
pricingCard
pricing, team tier
notification.error
notification.error
notification
toast, error
checklist.todo
checklist.todo
checklist
checklist, all open
table.pricing
table.pricing
table
table, pricing rows
timeline.release
timeline.release
timeline
release timeline
stepFlow.start
stepFlow.start
stepFlow
steps, at start
stepFlow.done
stepFlow.done
stepFlow
steps, all complete
kanban.two
kanban.two
kanban
two-column board
tabBar.four
tabBar.four
tabBar
four-tab control
toast.error
toast.error
toast
snackbar, error + retry
toast.info
toast.info
toast
snackbar, info
logLines.errors
logLines.errors
logLines
log stream with errors
chatBubble.support
chatBubble.support
chatBubble
support thread
avatarStack.large
avatarStack.large
avatarStack
larger avatar stack
reactionBar.love
reactionBar.love
reactionBar
reactions (love set)
logoWall.four
logoWall.four
logoWall
four logos, 2 cols
badge.warn
badge.warn
badge
badge, warning
badge.info
badge.info
badge
badge, info
banner.info
banner.info
banner
banner, info (blurple)
banner.warn
banner.warn
banner
banner, warning (amber)
spinner.small
spinner.small
spinner
small looping Lottie
quote.customer
quote.customer
quote
customer quote
terminal.build
terminal.build
terminal
build output
checklist.done
checklist.done
checklist
checklist, all complete
kpiRow.time
kpiRow.time
kpiRow
latency percentiles
badge.beta
badge.beta
badge
beta status badge