UI Playground

UI Playground is a sandbox I built for prototyping UI elements in isolation, recording clean demos, and exporting the code for each element.

Other tools exist for these functions — a UI sandbox, a demo recording tool, and so on. I just didn’t feel like paying for them…

The tool is connected to Claude Code: prompt and build your element(s) there, and UI Playground acts as your live view. You can save elements to a library and export the code for use in another project. My favorite part is the focus/record mode — pick a background, add a watermark, and have a clean environment to record your elements in action. Pretty sweet.