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
| Parameter | Example value | What it does |
|---|---|---|
| slug | paint-cost-uk | The calculator identifier from the dropdown. Each calculator has its own /embed/{slug} URL. |
| theme | auto | light | dark | Forces the widget colour scheme. Auto inherits the visitor's system preference. |
| width | 100% | 600px | CSS width of the iframe. 100% is best for responsive pages; fixed px works for sidebars. |
| minHeight | 520 | Starting height in pixels. The auto-resize script will grow or shrink the iframe to fit the calculator. |
| autoResize | true | false | Includes 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.