Can you embed Cal.com in an iframe?

1. 1Open your event types in Cal.com.
2. 2Click the three dots of the event type. Then clickEmbed
3. 3Select the inline embed type.
4. 4Set the size, theme, brand color, layout, and event type details.
5. 5Copy the HTML code snippet. Paste it into your page.

<div id="my-cal-inline" style="width: 100%; height: 100%; overflow: scroll"></div>
<script type="text/javascript">
  (function (C, A, L) { let p = function (a, ar) { a.q.push(ar); }; let d = C.document; C.Cal = C.Cal || function () { let cal = C.Cal; let ar = arguments; if (!cal.loaded) { cal.ns = {}; cal.q = cal.q || []; d.head.appendChild(d.createElement("script")).src = A; cal.loaded = true; } if (ar[0] === L) { const api = function () { p(api, arguments); }; const namespace = ar[1]; api.q = api.q || []; if (typeof namespace === "string") { cal.ns[namespace] = cal.ns[namespace] || api; p(cal.ns[namespace], ar); p(cal, ["initNamespace", namespace]); } else p(cal, ar); return; } p(cal, ar); }; })(window, "https://app.cal.com/embed/embed.js", "init");
  Cal("init", { origin: "https://cal.com" });
  Cal("inline", {
    elementOrSelector: "#my-cal-inline",
    calLink: "{username}/{event-slug}",
  });
</script>

Set calLink to the path of your link, not the full URL. Self-hosted Cal.com gives a snippet for its own origin.

You can embed an event type or your profile page. Cal.com documents routing forms as a separate snippet.

Good to know

• The embed types are inline, pop-up on element click, and floating button pop-up.
• Cal("ui", { hideEventTypeDetails: true }) hides the title, duration, and description card.
• The generator gives an HTML snippet and a React snippet.
• To track UTM parameters, read them from your page and pass them in the embed config.

Sources

• Cal.com Help · Adding embed to your webpagecal.com/help/embedding/adding-embed
• Cal.com Help · Getting Embed Code Snippetscal.com/help/embedding/embed-snippet-generator
• Cal.com Help · Embed instructionscal.com/help/embedding/embed-instructions
• Cal.com Help · UTM Parameter Tracking in Embedscal.com/help/embedding/utm-tracking-embed
• Cal.com GitHub · embed-snippet sourcegithub.com/calcom/cal.com/blob/main/packages/embeds/embed-snippet/src/index.ts
• iframecheck live check · both links9 Nov 2026, 02:52 UTC

Profile updated Oct 15, 2026