Device Mockup

Tasteful, token-driven device frames for wrapping screenshots in marketing sections and empty states — a browser window with traffic-light dots and a URL pill, and an iPhone bezel with a notch. Pure CSS, so they flip in dark mode and scale responsively.

$bunx shadcn@latest add @nx-ui/device-mockup
Registry item
Installs withutils

Browser mockup

A window chrome with traffic-light dots and an optional URL pill. Drop a screenshot (or any node) inside; it is clipped to the screen area.

app.nexusregen.com/dashboard

Browser mockup without a URL

Omit url for a cleaner, chromeless header — handy when the address would only distract.

iPhone mockup

A phone bezel with a notch and a rounded screen, for showing a mobile view alongside the desktop one.

API reference

Exported parts and their props, extracted from the component source.