Components

Frame

Add visual emphasis with styled frames

Frames add visual emphasis to images, videos, or other embedded content.

Basic Usage

<Frame caption="Barodoc dashboard preview">
  <img src="/images/dashboard.png" alt="Dashboard" />
</Frame>

Without Caption

<Frame>
  <img src="/images/screenshot.png" alt="Screenshot" />
</Frame>

With Video

<Frame caption="Demo video">
  <video controls className="w-full">
    <source src="/videos/demo.mp4" type="video/mp4" />
  </video>
</Frame>

Props