Embed

Embed renders supplied metadata immediately. When metadata is incomplete, it tries a supported oEmbed provider, selected Schema.org websites, and finally OpenGraph.

Prosefly

Astro Theme Lotus

A documentation theme for Astro, built for expressive content.

Import

import { Embed } from '@prosefly/astro-components';

Explicit Metadata

Pass display metadata directly for deterministic builds. Explicit props always take precedence over resolved metadata.

<Embed
  kind="link"
  url="https://astro-theme-lotus.prosefly.dev/"
  title="Astro Theme Lotus"
  description="A documentation theme for Astro, built for expressive content."
  image="/images/og.png"
  siteName="Prosefly"
/>

Resolve a URL

With only a URL, Embed resolves supported providers during Astro rendering and caches the result under .astro/prosefly/embed.

<Embed url="https://www.youtube.com/watch?v=-a0ecQMq-rM" />

Supported oEmbed providers include YouTube, Vimeo, Spotify, SoundCloud, Apple Music, Apple Podcasts, X, Bluesky, and Flickr. Selected App Store, Google Play, Product Hunt, Letterboxd, and Rotten Tomatoes pages use Schema.org metadata. Other URLs fall back to OpenGraph and then an ordinary linked card.

Set fetch={false} when intentionally rendering incomplete explicit metadata without a remote request.

<Embed
  url="https://example.com/article"
  title="A deliberately minimal card"
  fetch={false}
/>

Props