Interface Playground

Make the design decisions for an interface yourself. Every change shows up in the sample site at once; the five presets change the layout, not just the colours.

How to use it

Pick a preset or start from the controls.
Adjust colours, typeface, heading size and corners.
Switch layout and density and watch the difference.
Copy a share link or export as CSS/JSON.

Technology

React 19
CSS custom properties
URL state
TypeScript

The service behind this experiment

Let’s build it for you

Fill in the short form and we’ll reply within one business day.