Embed a calculator on your site

Free to use on any site, commercial or not. Paste one line of HTML and the working calculator appears on your page: same formulas, same cited standards, no ads, no signup, nothing tracked back to your visitors beyond a standard page request.

The only condition is the attribution link that ships inside each embed. Leave it in place and you are free to use these anywhere.

Optional: auto-height

Each embed posts its content height to the parent page. Add this once, anywhere on the page, and the iframe resizes itself instead of scrolling. Skip it and the fixed height below works fine.

Paste once per page

<script>
window.addEventListener("message", function (e) {
  if (!e.data || e.data.type !== "tallyard:embed-height") return;
  var f = document.getElementById("tallyard-" + e.data.slug);
  if (f) f.style.height = e.data.height + "px";
});
</script>

Concrete calculator

See the full page

Cubic yards for slabs, footings, and round pours, with waste included.

Embed code

<iframe
  id="tallyard-concrete-calculator"
  src="https://www.tallyard.com/embed/concrete-calculator"
  title="concrete calculator"
  width="100%"
  height="620"
  style="border:1px solid #DCE2DB;border-radius:6px;max-width:520px"
  loading="lazy"
></iframe>

Mulch calculator

See the full page

Cubic yards and bags by bed area and depth.

Embed code

<iframe
  id="tallyard-mulch-calculator"
  src="https://www.tallyard.com/embed/mulch-calculator"
  title="mulch calculator"
  width="100%"
  height="580"
  style="border:1px solid #DCE2DB;border-radius:6px;max-width:520px"
  loading="lazy"
></iframe>

Gravel calculator

See the full page

Tons and cubic yards of base or decorative stone.

Embed code

<iframe
  id="tallyard-gravel-calculator"
  src="https://www.tallyard.com/embed/gravel-calculator"
  title="gravel calculator"
  width="100%"
  height="580"
  style="border:1px solid #DCE2DB;border-radius:6px;max-width:520px"
  loading="lazy"
></iframe>

Paint calculator

See the full page

Gallons by wall area, coats, and surface.

Embed code

<iframe
  id="tallyard-paint-calculator"
  src="https://www.tallyard.com/embed/paint-calculator"
  title="paint calculator"
  width="100%"
  height="620"
  style="border:1px solid #DCE2DB;border-radius:6px;max-width:520px"
  loading="lazy"
></iframe>

Deck stair calculator

See the full page

Stringer layout with a printable cut sheet and IRC R311.7 checks.

Embed code

<iframe
  id="tallyard-deck-stair-calculator"
  src="https://www.tallyard.com/embed/deck-stair-calculator"
  title="deck stair calculator"
  width="100%"
  height="900"
  style="border:1px solid #DCE2DB;border-radius:6px;max-width:520px"
  loading="lazy"
></iframe>

Questions people ask

Is it really free?: Yes, including on commercial sites. Keep the attribution link inside the embed and there is nothing else to do.
Will it slow my page down?: The snippet uses lazy loading, so the calculator only loads when a visitor scrolls near it. Fonts are self-hosted and there are no third-party ad or tracking scripts inside the frame.
Can I change the styling?: The frame border, width, and corner radius are yours to edit in the snippet. The calculator inside keeps its own styling so the numbers stay legible and the formula stays visible.
Do you want a different calculator?: These five are the ones most useful to other sites. If you would use a different one, ask for it and it can be added to the list.