Tally My Hours

Put a working calculator on your own site

Paste this into any page and your visitors get a real hours calculator, not a screenshot of one. Free, no sign-up, no API key.

Live preview - this is the actual widget

The code

Paste this wherever you want the calculator to appear.

<iframe src="https://tallymyhours.com/embed/hours-calculator"
  width="100%" height="300"
  style="border:1px solid #e3dbc7;border-radius:12px"
  title="Hours calculator" loading="lazy"></iframe>
Optional: auto-resize the height

The fixed height above works everywhere, but the widget's real height varies slightly by browser and screen. Add this immediately after the iframe and it will resize itself automatically.

<script>
(function () {
  var f = document.currentScript.previousElementSibling;
  window.addEventListener('message', function (e) {
    if (e.origin !== 'https://tallymyhours.com') return;
    if (e.data && e.data.type === 'tmh-embed-resize' && f) {
      f.style.height = e.data.height + 'px';
    }
  });
})();
</script>

Why this is free

The only condition is the small credit link at the bottom of the widget - "Calculator by TallyMyHours.com" - pointing back here. That is the entire arrangement: you get a real, working calculator with zero maintenance on your side, and we get a link. No approval process, no account, no API key, nothing to sign.

What you are actually embedding

An iframe loading a page on our server, the same one shown in the live preview above. It is not a screenshot and not a simplified copy - it is the real calculator, running our real calculation code, so a fix or improvement on our end reaches your page automatically.

It carries no ads and asks your visitors for nothing. It does not track anyone or set cookies. The only network request it makes is loading itself.

Sizing it

The default code uses a fixed height="300", which fits the widget comfortably in every browser we have tested, with a little room to spare. If you want it pixel-perfect regardless of font rendering differences, add the optional auto-resize script above - it listens for the widget reporting its own height and adjusts the iframe to match, with nothing for you to configure.

Width is fluid: set it to whatever column or sidebar you are placing it in, from about 260px up to full article width.

Removing it later

Delete the iframe tag. There is nothing else to undo, no account to close, no callback to us.

Common questions

Is embedding this calculator really free?

Yes. There is no fee, no account and no approval step. The only expectation is that the small credit link in the widget stays in place.

Will it slow down my page?

It loads in an iframe, so it does not block your page from rendering, and it only starts loading once the browser reaches that part of the page if you keep the loading="lazy" attribute in the code.

Can I remove the credit link?

That link is what makes the widget free to use, so please keep it. If you would rather not display it, the honest options are to build your own calculator or link to tallymyhours.com in the surrounding text instead.

Does it work on mobile?

Yes, the widget itself is fully responsive. Set the iframe width to 100% of its container and it will adapt down to a narrow phone screen.

Can I embed a different calculator, like overtime or PTO?

The hours calculator is the first one available as an embed. If you need a different one for your site, get in touch and let us know which - that shapes what we add next.

Does this collect any data from my visitors?

No. The widget has no analytics, no cookies and no tracking of any kind. It computes entirely in your browser, on your page.

Related calculators