Templates: open, adapt, share
Three finished pages that show what an HTML file can become. One tap into your library – or as a prompt that lets Claude build your own version.
Monthly report
KPIs, trend, segments, risks – on one page
The classic management report as an interactive page instead of a PDF: four KPIs with change, a 12-month chart, revenue by segment, highlights and risks. Numbers are placeholders – replace them or have Claude fill them from your spreadsheet.
For: Management, investors, advisory boards
Includes
- KPI tiles with month-over-month change
- Line chart without external library
- Segment table with bars
- Section for highlights, risks, next steps
Claude prompt to rebuild
Create a monthly report as a standalone HTML file (no external CSS/JS, readable on mobile). At the top four KPI tiles (revenue, EBITDA margin, new customers, churn) with month-over-month change in green/red. Below, a line chart of the last 12 months as inline SVG, a table “Revenue by segment” with share bars and a section “Highlights & risks” as a list. Use these numbers: [paste table here]. Colours: dark blue #0f172a, accent #1a6be6. Give every KPI a data-kpi attribute so comments can be pinned unambiguously.
Calculator
Move sliders, instant result – shareable with saved values
An ROI calculator with five sliders (hours, hourly rate, saving, setup and running costs) and an instant result: yearly saving, payback, ROI. Values can be saved in the URL so the recipient sees exactly your assumptions.
For: Sales, consultants, project leads
Includes
- Five input sliders with live display
- Result box with yearly saving and payback
- Save values via URL
- No framework, 5 KB
Claude prompt to rebuild
Build a calculator as a standalone HTML file for: [question, e.g. “Is introducing X worth it?”]. Inputs as sliders with live value display: [list of inputs with min/max/default]. Result large in a dark box (main figure), below two secondary figures. Formula: [formula]. A button “Save values” writes all inputs into the URL (history.replaceState) and reads them back on load. Mobile first, no external CSS/JS, accent colour #1a6be6.
One-pager / pitch
Problem, solution, numbers, plan, decision – to scroll through
A project proposal on one page: hero with claim, then problem, solution, three key figures, timeline, risks and the specific decision needed. Recipients comment directly on the paragraph they see differently.
For: Internal proposals, founders, project teams
Includes
- Hero with claim and date
- Sections problem / solution / numbers / plan / risks
- Timeline in four steps
- Decision box at the end
Claude prompt to rebuild
Write a one-pager as a standalone HTML file for this proposal: [topic in 2–3 sentences]. Structure: coloured header with title and a one-sentence claim; sections “Problem”, “Solution” (3 points), “Numbers” (3 key figures as tiles), “Plan” (4 steps as a timeline), “Risks” (2 points) and a dark box “Decision” with the specific ask and deadline. Short sentences, no filler, readable on mobile, no external CSS/JS. Give every section an id so comments can be pinned unambiguously.
More templates to come – wishes to hello@annopane.com.
Try it with a file you already have.
Free, no sign-up. Upload, share the link, collect feedback.
Start for free