Shu Ding of Vercel has released SPEC-01/HARDWARE, a theme that restyles Vercel’s UI SDK components as synthesiser and drum-machine controls: chunky keys, knobs, faders and LCD screens. The site is live and the theme installs through a shadcn registry.
Ding announced it on X on 14 November, calling it “themed components built with @Vercel UI SDK”. shadcn, who introduced UI SDK for Vercel on 12 November, quote-posted it with “SPEC-01 just dropped.”
SPEC-01/HARDWARE
— Shu (@shuding) November 14, 2026
Themed components built with @vercel UI SDKspec-01.vercel.app
Sound on
UI SDK is Vercel’s open-source library of interface behaviours, such as focus, keyboard navigation and popups, that an agent puts together into components. It ships without styling, so SPEC-01 is a worked example of what a full skin on top of it looks like. The SPEC-01 page says every control on it is a UI SDK component underneath.
What’s in the kit
The home page is a grid of numbered controls, from buttons, switches and sliders to knobs, a calendar, a command palette and a resizable panel layout. The header carries six key colours (red, yellow, green, blue, purple and black) and a speaker button. Seven more pages show the controls working together as small apps.
| Page | Registry description |
|---|---|
| Player (MP-1) | Transport keys, an LCD, a scrubbing fader and a playlist |
| Paint (PX-1) | A drawing pad behind glass, with tool and ink keys, brush dials, undo, clear and save |
| MIDI (MX-1) | A step sequencer with a piano roll, patterns and tempo |
| Timer (TM-1) | A countdown timer on an LCD, with a mode switch and start and reset keys |
| Color (CX-1) | A hue and lightness dial, harmony swatches, copy and random keys |
| Photo (IX-1) | A photo editor with aspect and look switches, crop, and an image on a display |
| Dashboard (DX-1) | A deployment console: an item list on a screen, a bar graph, a D-pad and deploy keys |
The 122 figure is a count of the items in the registry file: 62 UI components, 52 demo components, seven blocks (the apps above) and one theme item.
How you install it
The site’s installation prompt is written for a coding agent. It reads:
Install components from the SPEC-01 shadcn registry,
https://spec-01.vercel.app/r/registry.json
Wrap the app in <Hardware> from components/ui/hardware.The Hardware item is the theme’s root. Its registry description says it sets up the skin’s stylesheets, the IBM Plex Mono font and the page-wide behaviours the components rely on: haptics, interaction sounds, keyboard-only focus rings, a block caret and Safari’s Tab order. Without a key colour the keys are black. The keyColor prop takes an OKLCH lightness, chroma and hue, and the registry docs give { l: 0.64, c: 0.31, h: 48 } as an orange-red example. OKLCH is a colour format that describes a colour by how light it is, how vivid it is and its hue angle.
Built on a UI SDK snapshot
The registry pins its components to @ui-sdk/react and @ui-sdk/core version 0.0.0-20261111125312.ga16c1d57, a snapshot build, not the 0.1.0-beta packages. UI SDK is still a public beta under Vercel’s beta terms, and its changelog lists one entry so far, the 12 November introduction. The code sample on the SPEC-01 page shows the pattern: a MIDI fader made with createSlider from @ui-sdk/core, with a range of 0 to 127 and an onValueChange that sends a control-change message.
Vercel CTO Malte Ubl wrote on 14 November that UI SDK “may very well bring back deep creativity to interface design as expression gets unshackled from poor accessibility”.
SPEC-01 just dropped.
— shadcn (@shadcn) November 14, 2026
The registry file has no licence field, and the site credits the work to Ding alone.
Discover more from Sulat AI & Tech News
Subscribe to get the latest posts sent to your email.
