Clockify Costs

A tiny Chrome extension that multiplies your tracked time by your hourly rate
and shows the result right next to the total on Clockify summary reports.

---

Why this exists

Clockify used to let every user set an hourly rate for free. The tracked time was shown alongside its value, and that was that.

At some point that moved behind a paid plan. Fair enough for the elaborate parts — invoicing, exporting cost sheets, per-project billing rates. But the basic case ("here is my rate, here is my time, show me the number") is a single multiplication. Putting that behind a paywall felt wrong, so this extension brings it back:

• You enter one hourly rate in EUR.
• On https://app.clockify.me/reports/summary, the extension reads the Total time for whatever filter you have set and prints ≈ 3.168,04 € next to it.

Nothing more. No invoices, no exports, no per-project rates.

Install

The extension is not on the Chrome Web Store. Load it unpacked:

1. Clone or download this repository.
2. Open chrome://extensions in Chrome (or any Chromium-based browser).
3. Enable Developer mode (top right).
4. Click Load unpacked and select the repository folder.
5. Click the extension icon, enter your hourly rate — it saves automatically.
6. Open a summary report. The cost appears next to the total time and updates whenever you change the filter.

The popup also has a small preview: type any duration (HH:mm:ss) to see what it is worth at your rate.

How it works

• content.js runs on app.clockify.me/reports/*. It looks for the total time element in the report header, parses the HH:mm:ss string, multiplies by the stored rate and appends a span with the result. A MutationObserver keeps it in sync when Clockify re-renders the header (filter or route changes).
• popup.html / popup.js store the rate in chrome.storage.sync, so it follows your Chrome profile. Changing the rate updates open report tabs immediately.

Privacy

The extension has a single permission: storage, used only for the hourly rate. It makes no network requests and sends nothing anywhere. The only thing it reads from the page is the total-time text.

Limitations

• Depends on Clockify's DOM structure (div[data-cy="TOTAL-TIME"] in the report header). If Clockify changes their markup, the number stops appearing until the selector is updated. Pull requests welcome.
• Currency is fixed to EUR and formatted with de-DE locale. Both are one-line changes in content.js and popup.js if you need something else.
• Only the summary report total is annotated, not individual rows.

Contributing

Issues and pull requests are welcome. Keep it small — the whole point is that this stays a minimal, dependency-free extension.

License

MIT

Not affiliated with or endorsed by Clockify / CAKE.com.