Magic UI

Safari

Install component

npxshadcn@latest add "https://21st.dev/r/magicui/safari"
import { Safari } from "@/components/ui/safari"

function SafariDemo() {
  return (
    <div className="relative">
      <Safari url="magicui.design" className="size-full" />
    </div>
  )
}

function SafariWithCustomImage() {
  return (
    <div className="relative">
      <Safari
        url="magicui.design"
        className="size-full"
        src="https://via.placeholder.com/1200x750"
      />
    </div>
  )
}

export default {
  SafariDemo,
  SafariWithCustomImage,
}