Can you embed Calendly in an iframe?

1. 1Go to your Scheduling page in Calendly.
2. 2Select the three dots on the event type card, or at the top right for your landing page. Then clickAdd to website
3. 3Select Inline embed. Then select Continue.
4. 4Set the options that you want, such as Hide event details or remove the cookie banner.
5. 5Select Copy Code. Paste the code into the HTML of your page.

<div
  class="calendly-inline-widget"
  data-url="https://calendly.com/{your-link}"
  data-resize="true"
  style="min-width: 320px; height: 700px;">
</div>
<script src="https://assets.calendly.com/assets/external/widget.js"></script>

Calendly also lets you use a plain iframe of your link. A plain iframe cannot resize itself.

Join two or more parameters with &. Only the first one starts with ?.

Good to know

• Calendly lists the embed on all plans. Custom colors (background_color, text_color, primary_color) need a paid plan.
• A plain iframe cannot resize itself and cannot send events with postMessage.
• Add data-resize="true" to the inline widget to fit its height. Use only one resizing embed on each page.
• hide_gdpr_banner=1 removes the cookie banner. Your site must then handle cookie laws such as GDPR or CCPA.
• The inline widget sends events to your page with window.postMessage(), for example when a person books.

Sources

• Calendly Help Center · How to add Calendly to your websitecalendly.com/help/how-to-add-calendly-to-your-website
• Calendly Help Center · How to customize your embedcalendly.com/help/how-to-customize-your-embed
• Calendly Help Center · Advanced Calendly embed for developerscalendly.com/help/advanced-calendly-embed-for-developers
• iframecheck live check · main page9 Nov 2026, 02:52 UTC

Profile updated Oct 15, 2026