react-embeds playground

Test the shared EmbedCard surface with Reddit, X/Twitter, Bluesky, and Instagram content. Toggle between platforms and customize display options.

Try a Reddit URL

⚙️ Embed Configuration

Set layouts globally or override per platform, plus dimensions using any active CSS unit (%, px, em, rem).

Customize how links function and where they open.

Reddit
Loading post...

Usage

Defaults (No Custom Settings)

Minimal usage renders exactly the same as the expanded defaults below.

Minimal Usage (Uses Default Embed Presets)
import { RedditEmbed, CardLayoutProvider } from "react-embeds";

<RedditEmbed
  url="$url"
/>
Default Embed Presets
import { RedditEmbed, CardLayoutProvider } from "react-embeds";

<RedditEmbed
  url="$url"
  maxBodyLength={220}
  showTitle={true}
  showSubreddit={true}
  showAuthor={true}
  showDate={true}
  showBody={true}
  showMedia={true}
  showUpvotes={true}
  showCommentCount={true}
  showPostType={true}
  showBranding={true}
  showCTA={true}
  ctaLabel="View on Reddit"
  ctaLabelIcon={true}
  ctaLabelIconPosition="before"
  ctaUsePlatformColor={true}
  ctaUsePlatformIconColor={false}
  disableCard={false}
  linkBehavior="cta"
  linkTarget="_blank"
/>