HowHeight widgets

Embed a height calculator on your site.

Pick a HowHeight tool, adjust the frame, then paste the embed code into your article, resource page, or site builder.

Tool

Widget title

Max widthHeight

Live preview

Open

Height Difference Calculator

Height Difference Calculator · Powered by HowHeight

Embed code

The attribution link is visible and points to the full HowHeight tool.

<div class="howheight-widget"
  data-widget="height-difference-calculator"
  data-embed-url="https://www.howheight.com/en/embed/height-difference-calculator?aName=Avery&amp;bName=Jordan&amp;aCm=167&amp;bCm=181&amp;unit=cm&amp;chrome=compact"
  data-tool-url="https://www.howheight.com/en/tools/height-difference-calculator"
  data-width="760"
  data-height="980"
  data-frame-title="Height Difference Calculator by HowHeight">
  <div class="howheight-widget-title">Height Difference Calculator</div>
  <div class="howheight-widget-footer">
    <a href="https://www.howheight.com/en/tools/height-difference-calculator" target="_blank" rel="noopener">Height Difference Calculator</a>
    · Powered by <a class="howheight-widget-brand" href="https://www.howheight.com" target="_blank" rel="noopener">HowHeight</a>
  </div>
</div>
<script defer src="https://www.howheight.com/widgets/howheight-widget.js"></script>
<noscript>
  <iframe src="https://www.howheight.com/en/embed/height-difference-calculator?aName=Avery&amp;bName=Jordan&amp;aCm=167&amp;bCm=181&amp;unit=cm&amp;chrome=compact" title="Height Difference Calculator by HowHeight" width="100%" height="980" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="display:block;width:100%;max-width:760px;border:0;border-radius:8px;overflow:hidden;"></iframe>
  <p style="margin:8px 0 0;font-size:12px;line-height:1.5;color:#64748b;">
    <a href="https://www.howheight.com/en/tools/height-difference-calculator" target="_blank" rel="noopener" style="color:#0f766e;text-decoration:underline;">Height Difference Calculator</a>
    · Powered by <a href="https://www.howheight.com" target="_blank" rel="noopener" style="color:#0f766e;text-decoration:underline;">HowHeight</a>
  </p>
</noscript>