A raise sounds simple until you try to picture what it actually pays. "5%" feels abstract - but $250 more per month, or $1.44 more per hour, is real.

So I built a free pay increase calculator for CalcVersa that turns any raise into the numbers that matter. No framework, no backend — one HTML file with vanilla CSS and JS that runs entirely in the browser. Here's how it works under the hood.

The three ways a raise arrives

Employers phrase raises three different ways, so the calculator has three modes:

  1. Percentage - "You got a 5% raise." → new pay = current pay × (1 + % ÷ 100)
  2. Flat amount - "We're adding $3,000." → percentage worked out backwards
  3. New salary - an offer letter with a new figure → the raise % is (new − old) ÷ old × 100

The trick is normalising everything to annual pay first, whatever the input frequency:

function factor(freq, hours) { if (freq === 'monthly') return 12; if (freq === 'biweekly') return 26; if (freq === 'weekly') return 52; if (freq === 'hourly') return hours * 52; return 1; // annual } var annual = pay * factor(freq, hours);

From one annual number, every output is a division away: monthly = annual ÷ 12, bi-weekly = annual ÷ 26, hourly = annual ÷ (hours × 52). One source of truth, no rounding drift between fields.

The feature most calculators skip: the real raise

A 3% raise in a 4% inflation year is quietly a pay cut. So the tool also shows your raise after inflation:

var realPct = ((1 + pct / 100) / (1 + infl / 100) - 1) * 100;

A 5% raise against 3% inflation gives a real raise of +1.94% — genuinely ahead, but by less than the headline number suggests. This one stat is why I built the tool.

Live currency conversion with a fallback chain

Users don't all earn in dollars, so the amount fields convert live between 19 currencies. Free exchange-rate APIs go down, so instead of trusting one source, the fetch walks a chain of four public endpoints and uses the first that answers with a complete rate table:

var chain = Promise.reject(new Error('start')); sources.forEach(function (s) { chain = chain.catch(s); });

If every source fails, the currency symbol still changes and the user is told the amounts were not converted - an honest error beats a silently wrong number.

What I deliberately kept boring

  • No framework. The whole tool is one self-contained block, so it can be pasted into any page builder and just work.
  • Gross figures only, clearly labelled - tax depends on country and state, and pretending otherwise would make the numbers lie.
  • Everything client-side. Nothing typed into the calculator ever leaves the browser.

Try it

The calculator is live here: Pay Increase Calculator - it sits next to its sibling tools, a salary calculator and an overtime calculator, so you can go from "what's my hourly rate?" to "what's my raise worth?" in one place.

If you build tools like this: what's your rule for when a calculator needs a backend, and when is one static file the better answer?