Skip to main content


@social-embed/lib is a repository of patterns and parsers for embed-friendly websites. You can use it in your web apps and scripts. It also powers the project's <o-embed> web component.

Supported embeds

See src/providers for the full manifest of supported content. As of 2021-04-21, it includes at least:

  • DailyMotion
  • Spotify
  • Vimeo
  • YouTube


  • Detecting if a URL is embeddable

    • Detecting subtle variations:,
  • Extracting IDs from embed-friendly sites, e.g. Bd8_vO5zrjo out of

  • Creating embed friendly URLs: ->

    To see this concept in action see Wistia's Construct a Wistia Embed Code page.

  • Avoid the repetition. StackOverflow, Regex websites detecting embed URLs

    (google search: youtube regex

Similar projects: js-video-url-parser


Internal API naming


These naming conventions aren't stable yet and are subject to change

  • Provider: String enum of supported embeds.
  • ${providerName}Regex: Name for JS regular expressions
  • get${providerName}IdFromUrl: Extracts ID from URLs (various formats), e.g.
    • '' -> 'Bd8_vO5zrjo'
    • '' -> 'Bd8_vO5zrjo'
  • get${providerName}EmbedUrlFromId: Turns ID into embed-friendly URL, e.g.
    • 'Bd8_vO5zrjo' -> ""

Regular expressions

import { getYouTubeIdFromUrl, youTubeUrlRegex } from "@social-embed/lib";

// ["","Bd8_vO5zrjo"]

Detect provider (e.g. YouTube) from URL

import { getProviderFromUrl } from "@social-embed/lib";

const provider = getProviderFromUrl("");
// YouTube

Get IDs from URLs

import { getProviderFromUrl, ProviderIdFunctionMap } from "@social-embed/lib";

const provider = getProviderFromUrl(""); // YouTube

if (provider) {
const getId = ProviderIdFunctionMap[provider];
// "Bd8_vO5zrjo"

Get iframe friendly URL

import {
} from "@social-embed/lib";

const embedId = getYouTubeIdFromUrl(""); // "Bd8_vO5zrjo"

const embedFriendlyUrl = getYouTubeEmbedUrlFromId(
); // ""

The above embed URL can fit right into an <iframe>:

<iframe src=""></iframe>

This is what the <o-embed> web component uses under the hood to render embeds.


See also

  • Installation

    npm i @social-embed/lib
    yarn add @social-embed/lib