Browser

A browser window mockup with traffic lights, navigation buttons, and an address bar. Useful for showcasing web content in documentation.

Default

Browser frame with address bar and content slot.

Default

omnira.space
Your content goes here

Empty

Minimal browser frame with no visible content.

Empty

vercel.com

With Content

Browser frame with placeholder content inside.

With Content

dashboard.omnira.space

Usage

Import and use the Browser component.

tsx
import { Browser } from "@/components/ui/Browser";

<Browser address="omnira.space">
    <div className="p-6">Your content here</div>
</Browser>

Props

PropTypeDefaultDescription
addressstring"example.com"URL displayed in the address bar.
childrenReactNodeContent rendered inside the browser window.