budge
An agent skill to tweak UI without going back-and-forth with AI
- ↑↓ to fine-tune the value
- ←→ to switch between properties
- T to snap to design tokens
- Enter to copy the prompt to clipboard
Works in Claude Code, Codex, Cursor.
Best viewed on desktop
Press T to snap to tokens
budge
font size
px
Reset
Copy
PromptSet font-size to px
usage
Install the skill, then type
/budge to invoke it. Ask your agent to make a visual change and budge will appear.$
tokens
If your project defines design tokens as CSS custom properties (
--spacing-md, --radius-lg, etc.), ↑↓ snaps through the scale and the copied prompt reads var(--spacing-md) instead of raw pixels. Works with Tailwind v4’s @theme, Shadcn, or any :root variables. Press T to toggle.| Property | Type | Description |
|---|---|---|
| label | string | Display name shown above bar |
| property | string | CSS property to apply |
| min | number | Minimum numeric value |
| max | number | Maximum numeric value |
| value | number | Current value |
| original | number | Value before the change |
| unit | string | "px", "%", "em", etc. |
| type | "color"? | Only set for color properties |
| scale | "spacing" | "radius" | "text" | "color" | null? | Override auto-detected token scale |
| tokens | BudgeToken[]? | Explicit tokens (overrides CSS-var discovery) |