MetalUI / Soft Hardware

React · SwiftUI · agent guides

Practice

the metronome ticks

Explore the documentation · Agent index · Source on GitHub

Start

Overview
How it fits together
Work in progress
Changelog
Performance

Foundations

Principles
Color & ink
Typography
Radius
Spacing
Sizing
Elevation
Materials
Sound
Motion
Transitions

Components

Icons

Blocks

Studio week
AI composer
Share panel
Availability picker
Task inbox
Settings

Objects

Attachment
Avatar
Block silhouette
Card
Code card
Connector
Day
Folder
Link card
Table
Weather

Instruments

Brush cursor
Cue family
Hover engraving
Lasso
Line handles
Perfect preview
Provenance tooltip
Selection frame
Size readout
Snap guides
Suggestion chip

Places

Drop zone
Empty state
Lens bar
Memory scrubber
Past banner
Region
Sidebar
Split pane

Parts

Dot display
Keycap
LED
Row
Skeleton
Spatial field
Swatch