Pudge

PUDGE/UI

AUX
Rotary Encoder
Push Button
TRACKS
42
SIGNAL
OK
TEMP
72°F
BPM
128
LCD Readout
OFF
STAB
Toggle Switch
L CHANNEL
VU Meter
Segmented Control
The agentic design system for 2000s-inspired interfaces
INTERACTIVE COMPONENTS

Touch everything

Push Button buttons
OFF
STAB
Toggle Switch toggles
AUX
Rotary Encoder dials
TRACKS
42
SIGNAL
OK
TEMP
72°F
BPM
128
LCD Readout readouts
L CHANNEL
VU Meter meters
Segmented Control buttons
STANDBY
REC Button buttons
12
CHANNEL
Stepper sliders
SILENT
RING
Slide Switch toggles
LED Checkbox toggles
Radio Button toggles
M
MANUAL
Mode Dial dials
HOW IT WORKS

Describe it. Feed it. Ship it.

  1. 01

    Describe your interface

    Pick from 93 spec-first components across 11 categories. Each spec documents the physical analog, mechanical principle, CSS recipe, and constraints that prevent "close but wrong" implementations.

  2. 02

    Feed the spec to any agent

    Works with any MCP-compatible tool — Claude Code, Cursor, Copilot — or manually copy-paste specs into your LLM of choice. The MCP server serves foundation context automatically.

  3. 03

    Get native components

    React, Vue, Svelte, SwiftUI, Jetpack Compose, Flutter — framework-native output, not wrappers. The agent generates pixel-perfect 2000s-inspired UI in your stack.

MATERIALS

Six canonical textures

Brushed Metal iPod back plate, MacBook chassis
Chrome Nikon mode dial ring, car stereo trim
Rubber Game Boy buttons, camera grip
Glossy Polycarbonate iPod Nano, PSP face, phone buttons
Glass iMac G3 shell, frosted diffuser
SIGNAL OK
Phosphor Screen Camera viewfinder, VU meter face
FRAMEWORK-AGNOSTIC

One spec, every stack

React React
Vue Vue
Svelte Svelte
Angular Angular
Next.js Next.js
Solid Solid
SwiftUI SwiftUI
Compose Compose
Flutter Flutter
Qwik Qwik
Ember Ember
HTMX HTMX

...and any stack your MCP-compatible agent can target.
The spec is the source of truth, not the runtime.

QUICK START

Add to your MCP config

{
  "mcpServers": {
    "pudge-ui": {
      "command": "npx",
      "args": ["-y", "pudge-ui-mcp"]
    }
  }
}

93 components across 11 categories, 6 materials, 9 foundation specs

Get Started Browse All Components
Pudge wearing a cape
PUDGE SAYS

Hey! I'm Pudge — the capybara who runs the pudgestudio.

My team and I built this whole UI system so you and your coding agent can have some fun and take a break from the monotone, AI slop that our LLMs create.

You can learn more about us at → pudgestudio.com, and if you end up resonating with us, you can always say hi to us on hour socials.

Pudge the capybara