Dreki Labs
Free widget

50/30/20 budget calculator widget

A free 50/30/20 budget calculator for your website. Readers enter their take-home pay and see it split into needs, wants and savings, with 60/20/20 and 70/20/10 options. One snippet, no scripts on your page, and it works with JavaScript off.

LiveBuilt for Loaf Budget · one snippet · no scripts on your page

How it works

  1. Enter your monthly take-home pay: what lands in your account after taxes and deductions.
  2. The calculator splits it: 50% for needs, 30% for wants, 20% for savings and extra debt payments.
  3. If your needs run higher, switch to 60/20/20 or 70/20/10 and compare.

Which split?

50/30/20
The classic split, popularized by Elizabeth Warren and Amelia Warren Tyagi in All Your Worth.
60/20/20
When rent and bills take more than half, as in many high-cost cities.
70/20/10
When fixed costs are high and you still want something going to savings.

A common guideline, not financial advice.

Put this calculator on your site

Pick a look, copy the code, and paste it into your page: a “Custom HTML” block in WordPress, a “Code” block in Squarespace, or “Embed code” in Wix. Free, no account needed.

Plain HTML: one iframe and a credit line. No scripts run on your page, and no cookies.

Questions

Does it work with WordPress, Squarespace and Wix?

Yes. Paste the code into a Custom HTML block in WordPress, a Code block in Squarespace, or Embed code in Wix. Anywhere that accepts HTML works.

Will it slow my site down?

No. It loads in its own frame, only when a reader scrolls near it, and adds no scripts or fonts to your page.

Does it track my visitors?

No. It sets no cookies, stores nothing about your readers and can't read your page. What a reader types stays in their browser. We only note which website it loads on.

Can it match my site?

It comes in light and dark versions, and you can choose its starting numbers. If you want one built in your own brand, get in touch.

Is it free?

Yes. Keep the credit line under it and use it on as many pages as you like.

What counts as a need versus a want?

Needs are what you have to pay to live and work: housing, groceries, utilities, insurance, transportation and minimum debt payments. Wants are what you could cut back on: eating out, streaming, travel, hobbies.

Is the 50/30/20 rule based on gross or take-home pay?

Take-home pay, meaning what's left after taxes and deductions. That's the money people actually budget with.

More widgets

All widgets
Live

Emergency fund calculator

Monthly essentials × 3, 6 or 9 months is your target, with progress toward it.

Live

Savings goal calculator

Save $X in N months: how much per month, per paycheck and per week.

Live

Debt payoff calculator

Balance, rate and payment: months to debt-free and what it costs in interest.

For businesses

Want a widget for your site?

Reviews, hours, FAQs and lead forms that load fast and match your brand. We build them for our clients.