Safari
macOS Safari browser mockup with realistic toolbar for React
Safari preview
Scroll to load preview
Frame your web screenshots in a Safari window. Traffic light buttons, back/forward nav, lock icon in the address bar—all the details that make browser mockups look real. Pass an image or video and it clips to the content area. Two modes: full toolbar or minimal for cleaner presentation. Dark mode adapts automatically.
Install with AI
If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this component for you — no copy-paste, no CLI:
use shadcnio to install the safari component into my projectRelated Components
FAQ
Was this page helpful?
Sign in to leave feedback.