Calcora

Embed Generator

Pick any of 240+ calculators and copy the iframe snippet. Free forever — a small “Powered by Calcora” credit stays in the widget.

Embed code
<iframe
  src="https://calcora.com/embed/length-converter"
  title="Length Converter"
  style="width:100%;border:0;min-height:520px"
  loading="lazy"
></iframe>
<script>window.addEventListener("message",function(e){if(e.data&&e.data.type==="calcora:height"&&e.data.slug==="length-converter"){var f=document.querySelector('iframe[src*="/embed/length-converter"]');if(f)f.style.height=e.data.height+"px"}});</script>
Live preview

Desktop — 1280×800px · 16 / 10

How to embed

Available parameters and common embed patterns

ParameterExample valueWhat it does
slugpaint-cost-ukThe calculator identifier from the dropdown. Each calculator has its own /embed/{slug} URL.
themeauto | light | darkForces the widget colour scheme. Auto inherits the visitor's system preference.
width100% | 600pxCSS width of the iframe. 100% is best for responsive pages; fixed px works for sidebars.
minHeight520Starting height in pixels. The auto-resize script will grow or shrink the iframe to fit the calculator.
autoResizetrue | falseIncludes a tiny listener that updates the iframe height when the calculator posts calcora:height messages.

Blog post or article

Use 100% width, 520 px min-height, and keep auto-resize on so the calculator never gets cut off as users change inputs.

<iframe src="https://calcora.com/embed/paint-cost-uk" style="width:100%;border:0;min-height:520px" loading="lazy"></iframe>

Sidebar widget

Use a fixed width (e.g. 320 px) and set min-height to 400 px for compact calculators like converters or ROI tools.

<iframe src="https://calcora.com/embed/eu-vat?theme=light" width="320" height="400" style="border:0" loading="lazy"></iframe>

Landing page hero

Set width to 100% and min-height to 640 px for a full-width interactive section. Pair with a strong CTA below the embed.

<iframe src="https://calcora.com/embed/construction-bid?theme=auto" style="width:100%;border:0;min-height:640px" loading="lazy"></iframe>

WordPress / no-code site

Paste the snippet into an HTML or Custom Code block. Most page builders have an 'HTML' element that accepts the iframe tag directly.

<!-- Custom HTML block -->
<iframe src="https://calcora.com/embed/heat-pump-roi" style="width:100%;border:0;min-height:520px" loading="lazy"></iframe>
Note on auto-resize: When the included script is present, the embedded calculator sends a calcora:height message as its content changes. The script then sets the iframe height so the widget never shows scrollbars or excessive whitespace.