Multiple sources, multi-language subtitles—all in one simple player.

Try the player Read the docs

Lightweight · responsive · all for free

Fast by default

A focused playback surface without a heavy interface around it.

Multiple sources

One player that brings movie, series, and anime sources together.

Simple to embed

Use a clean URL, then tune playback with documented parameters.

Player

Test it yourself.

Choose a type, enter its TMDB ID, and preview the playback experience.

Documentation

Everything you need.

Configure the embed and connect watch progress without adding unnecessary complexity.

Customize player

Embed parameters

Turn options on or off to build your embed URL.

Generated embed URL

https://your-player-domain.com/tv/124364/1/3
Parameterautoplay

Controls if the media starts playing automatically.

Enabled
ParameterstartAt

Starts the media at the specified time in seconds.

Enabled
Parameteroverlay

Shows metadata and logo while paused.

Enabled
Parameterskip

Shows skip button when timestamps are available.

Enabled

TV embeds only

These are ignored on movie URLs.

TV only
ParameternextButton

Shows the Next Episode button in the player controls.

Enabled
ParameterepSelector

Shows the season and episode selector.

Enabled
ParameterautoNext

Loads and plays the next episode when the current one ends.

Enabled

Watch Progress

Save progress on your site

The player stores progress inside its own localStorage and can also send the same data to your parent page when you pass eventsOrigin.

Parent listener
window.addEventListener("message", ({ origin, data }) => {
  if (origin !== "https://your-player-domain.com" || !data) return;

  if (data.type === "PLAYER_EVENT") {
    const { event, currentTime, duration, tmdbId, mediaType } = data.data;
    console.log(event, currentTime, duration, tmdbId, mediaType);
  }

  if (data.type === "MEDIA_DATA") {
    localStorage.setItem("vidMagicProgress", JSON.stringify(data.data));
  }
});
Request current status
const iframe = document.querySelector("iframe");
iframe?.contentWindow?.postMessage(
  { type: "GET_STATUS" },
  "https://your-player-domain.com"
);
Event shape
{
  type: "PLAYER_EVENT",
  data: {
    event: "play" | "pause" | "seeked" | "ended" | "timeupdate" | "playerstatus",
    currentTime: number,
    duration: number,
    tmdbId: number,
    mediaType: "movie" | "tv",
    season?: number,
    episode?: number,
    playing: boolean,
    muted: boolean,
    volume: number
  }
}
Stored data
{
  "t63174": {
    "id": 63174,
    "type": "tv",
    "title": "Lucifer",
    "poster_path": "/ekZobS8isE6mA53RAiGDG93hBxL.jpg",
    "backdrop_path": "/wbiPjTWpZMIB8ffBq7HvzAph4Ft.jpg",
    "progress": {
      "watched": 793.207692,
      "duration": 2695.3689
    },
    "last_season_watched": 1,
    "last_episode_watched": 1,
    "show_progress": {
      "s1e1": {
        "season": 1,
        "episode": 1,
        "progress": {
          "watched": 793.207692,
          "duration": 2695.3689
        },
        "last_updated": 1742578021768
      }
    },
    "last_updated": 1742578021768
  },
  "m533535": {
    "id": 533535,
    "type": "movie",
    "title": "Deadpool & Wolverine",
    "poster_path": "/8cdWjvZQUExUUTzyp4t6EDMubfO.jpg",
    "backdrop_path": "/by8z9Fe8y7p4jo2YlW2SZDnptyT.jpg",
    "progress": {
      "watched": 353.530349,
      "duration": 7667.227
    },
    "last_updated": 1742577064433
  }
}