how far off the number is.
saving for something specific works better when the progress is visible, which is why every banking app has a savings pot with a little bar.
those bars are attached to a product. what most people want is the bar, for a goal that does not live in one account — a deposit spread across three places, a car fund that is partly cash.
a page does that in a minute: your target, what you have, what you add, and what is left. no account, no product, no bank.
a bar, and honest arithmetic under it.
01 / what it isthe useful parts of a savings tracker are the two numbers everyone keeps in their head badly: how much is left, and when it will be done at the current rate. both are trivial arithmetic and both are much more motivating on a screen than in an estimate.
the projection is the part to keep honest. "on track for march" is a statement about your contributions continuing exactly as they have, which is an assumption, not a plan — so the page says that rather than presenting a date as a fact.
- your target, and what is in the pot today
- contributions logged as they happen, from wherever they come
- how much is left and what percentage is done
- a projected date, based on your rate and clearly labelled as arithmetic
- a history, so a bad month is visible rather than smoothed away
- export and import as json
- what it records
- target, current amount, contributions and their dates
- what it computes
- remaining, percentage, and a projected date from your actual rate
- where that goes
- localStorage in one browser. no bank connection, nothing uploaded
- what it is not
- a savings account, and it holds nothing
see one in action.
02 / examplea deposit goal with contributions from three sources and a projected date under a stated assumption
the live example is still being built — the prompt below is the one it was made with.
copy this, then make it yours.
03 / starting prompta starting point, not a template — the point of an agent is that the result is yours. change the sections to match what you want, and remove anything you don’t need.
Build me a savings goal tracker as a single web page.
Ask me first:
- What I am saving for and the target amount.
- What I have already, and whether it comes from more than one place.
- How much I add and how often, if it is regular.
- Whether I want a target date, or just to see when the current rate gets me there.
- My currency.
Do not invent a target, a rate, or a date. Do not suggest how much I should be saving.
WHAT IT DOES
- The top of the page: how much is left to the target, and the percentage done. Both large.
- A progress bar that is honest — proportional, not exaggerated at the low end.
- Logging a contribution is two taps and a number, with the date defaulting to today and an optional note about where it came from.
- A projection: at the average rate of my actual contributions so far, when the target is reached. Label it clearly as arithmetic on past contributions, not a plan or a promise.
- If I gave a target date: whether the current rate gets there, stated as a number — how much more per month would be needed — rather than as encouragement or warning.
- A history of contributions, so the rate is visible and a quiet month is not smoothed over.
- Let me adjust the target; goals change.
DESIGN
- One screen. The remaining number is the page.
- No celebration animation at milestones unless I ask for it. No guilt when a month is empty.
- Readable on a phone, which is where it will be opened after a payday.
BE HONEST ON THE PAGE
- Say the figures are stored in this browser only and are not connected to any account.
- Say the projection is arithmetic on what I have already contributed and is not advice or a guarantee.
- Do not imply the page holds money or represents a balance anywhere.
STORING THE DATA
- Save everything to localStorage in the browser, automatically, as I go. No
accounts, no login, no server call.
- On the page, say plainly that data lives in this browser only and does not
sync to other devices. Do not bury it.
- Give me an "export" button that copies or downloads everything as JSON, and an
"import" that reads the same JSON back. That is the only way my data can move
between devices, so it is not optional.
- Never lose what I have already entered. If the stored data is from an older
version of the page, read what you can rather than throwing it away.
DELIVERY
- Produce one self-contained HTML file. Inline the CSS and JavaScript.
- No build step, no server, no framework, no package install, no external
requests at runtime.
- Mobile-first and responsive; it has to be usable one-handed on a phone and
still look right on a laptop.
- Accessible: semantic HTML, real contrast, visible keyboard focus, labelled
controls, touch targets big enough to hit, and respect reduced-motion.
- Use placeholders where information is missing. Do not invent facts, numbers,
names, dates, prices, or results I have not given you.
- Before you call it finished, use it yourself: enter real-looking data, reload
the page, and confirm nothing is lost or mangled.
PUBLISHING
Publish the finished page to HTMLShare and give me the link.
Use exactly one of the two paths below, preferring the first. Make the call
directly. Do not route it through a code sandbox, container, or computer-use
session — that is where the request gets blocked, and it is never necessary.
1. An HTMLShare integration or connector, if you have one configured.
The page is permanent and owned by my account. Report the url and the
siteId. There is no claimUrl or manageToken on this path — do not go
looking for one, and do not switch paths in order to produce one.
2. Otherwise, publish anonymously over REST. No account, key, or signup is
needed:
POST https://api.htmlshare.net/v1/publish
content-type: application/json
{"html": "<!doctype html> ... "}
The reference is https://htmlshare.net/docs and, for the full schema,
https://api.htmlshare.net/openapi.json
Report these from the response, in your reply and never inside the page:
url the public page
claimUrl a private link that is mine alone. opening it is how I keep
the page past its 24-hour expiry, or set an email reminder
before it goes. it carries the manage token, so it must
never appear in the published HTML or anywhere a visitor
could see it.
manageToken the only thing that can edit or delete this page later. it is
returned once and never again, so tell me what it is.
Tell me which of the two you used. If the path you reach for first is
unavailable in your environment, say so and tell me what you are switching to
before you publish — a permanent page on my account and a 24-hour anonymous
page are different things, and which one I get is my decision, not a detail.
If I ask for a change afterwards, update the existing page instead of
publishing again, so the URL I have already shared keeps working — through the
same integration on path 1, or with the manage token as an X-Manage-Token
header on path 2.
RECIPE MARKER
Include this tag in the <head>, exactly as written:
<meta name="htmlshare-recipe" content="savings-goal-tracker">
It tells htmlshare which recipe the page came from, so the library can count
that this one was actually made. It carries nothing else.give it a url.
04 / publishing ithow you publish depends on how you’re working.
- with an integration
- if your assistant already has htmlshare connected — mcp or another supported integration — just ask it to publish the finished page and hand back the url. the page belongs to your account and is permanent. when you want a change, ask for an update to that same page rather than a new one.
- with no integration
- the prompt tells the assistant to post the html to the rest api instead, which needs no account and no key. it comes back with a live url you can open immediately, a private claim link, and a manage token. the claim link is how the page stops being temporary — keep it.
- by hand
- nothing stops you doing it yourself: have the assistant give you the html file and drop it on the htmlshare home page. same url, same page, one more step.
- what matters here
- a goal worth tracking takes months, so the page has to last months. claim it and keep the target vague enough in the html that a stranger with the url learns nothing about you.
saving takes longer than a day.
05 / keeping it aroundthe page stops serving 24 hours after publishing, with a 7-day recovery window. that is not a savings horizon.
claim it. this is a page you open once or twice a month for a year, which only works at a permanent address.
- keep it around
- goals take months and anonymous pages take a day.
- custom url
- a page you check after payday should be one tap, not a search.
- stable updates
- targets move. change the page without losing the address you have been using.
questions.
06 / questionsdoes it connect to my savings account?
no. there is no bank integration and no balance being read — you log contributions yourself. that is more typing and it means nothing has access to your accounts.
is the projected date reliable?
it is arithmetic on your contributions so far, which is only as reliable as those continuing. the prompt asks for it to be labelled that way precisely so it does not quietly become a plan.
can two of us save toward the same thing?
you can both open the page, but the figures are per browser, so one device has to hold the record. log both people’s contributions there with a note of who added what.
is my target visible to anyone with the link?
whatever is written into the page is — the amounts you enter are not, since those are in your browser. if the goal itself is private, describe it vaguely when you ask for the page.