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, etc. 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 your elements to a library and export its 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.
A walkthrough of the core workflow..
Saving a new element to the gallery..
Logo, backgrounds built with Midjourney, and inspo art also built with Midjourney.