About Sankey diagrams
A Sankey diagram shows how something flows from one place to another. Each flow is a band, and the width of the band is the amount. One look tells you where most of it goes.
People use them for:
- Personal budgets — where your salary goes: rent, food, savings, fun
- Company finances — revenue to costs, tax and profit, like in annual reports
- Energy — from fuel to electricity to homes, and how much is lost on the way
- Websites and apps — where visitors come from and where they leave
- Sales funnels — leads to calls to offers to customers
- Job hunts — applications to interviews to offers, a favourite on Reddit
This generator draws the diagram as you type. There is no account, no watermark, and your numbers never leave your computer.
How to use it
- Type one flow per line: the start, the amount in square brackets, then the end — for example Salary [4200] Budget
- Or paste three columns from Excel or Google Sheets: from, to, amount
- The diagram is drawn straight away; add a title if you want one
- Pick a style — Classic, Minimal, Bold, Soft, Outline, Dark, Neon or Editorial — then the colours and the image size
- Add a currency or unit before or after the numbers, like $ or kWh
- Click Download PNG or Download SVG
Writing your flows
- One flow per line: Budget [1500] Rent means 1,500 goes from Budget to Rent.
- Boxes connect by name. Write Salary [4200] Budget, then Budget [1500] Rent, and Budget becomes a box in the middle that the money passes through. Names must be spelt the same way each time.
- Many levels are fine: Salary → Budget → Savings → Investments.
- The same flow twice is added together.
- Your own colour for a box: a line like :Savings #22c55e.
- Comments: a line starting with // is ignored.
- Numbers can be written as 4200, 4,200 or 4200.50.
If the money going into a box is more than the money going out (or the other way round), the box is as tall as the bigger amount — so you can see what is left over.
Eight styles
- Classic — clean and clear, for reports and documents
- Minimal — thin bars and light flows, when the numbers matter more than the colour
- Bold — thick bars and strong colours that still read from the back of a room
- Soft — rounded bars on a warm off-white, for posts and newsletters
- Outline — hollow bars and very light flows, for a printed page that saves ink
- Dark — a navy background for dark slides and dashboards
- Neon — glowing flows on black, for social media and title slides
- Editorial — the look of financial news and research reports: soft flows coloured by branch, thin dark bars, small dots for the smallest items, bold two-line labels, and the total in the middle shown as a big headline number
Editorial works best as a "bow-tie": many sources flow into one total in the middle, which then spreads out into groups and smaller items — for example companies → *Total spending* → categories → suppliers. The tool finds the middle box by itself.
A style changes only the look. Your flows, the colour set and the size stay as you chose them, so you can try every style in a few clicks.
The settings
- Flow shape — smooth curves, or straight bands
- Direction — left to right, or top to bottom (good for tall phone images and funnels)
- Amounts — the numbers, each box's percent of the total, both, or none
- Colours — five colour sets for the boxes
- Flow colour — like the box it starts from, like the box it ends in, by branch (each group after the middle keeps one colour all the way to the end), a fade between the two, or plain grey
- Before / after numbers — a currency sign or a unit, shown on every amount
- Image size — wide for slides, square for social posts, tall for phone screens
- Box width, space between boxes, text size — fine-tune the look
- Transparent background — a PNG without the white background, for slides with a coloured design
Everything happens on your device
The diagram is drawn by a small script in your browser. Your flows are not uploaded and nothing is stored online. Your last list is remembered on this device only, so it is still there when you come back.
Frequently asked questions
How do I make a Sankey diagram?
Type each flow on its own line as "From [amount] To", for example "Salary [4200] Budget". The diagram appears as you type. Then click Download PNG or Download SVG.
Can I make a Sankey diagram from Excel?
Yes. Put the data in three columns — from, to, amount — then copy the rows and paste them into the box. A header row is skipped.
Is this like SankeyMATIC?
It uses the same simple "From [amount] To" lines, so a list you made there works here too. Everything runs in your browser, with no sign-up.
Why is one of my flows not drawn?
A Sankey diagram flows in one direction, so a loop (A → B → A) cannot be drawn. The tool leaves out the flow that would close the loop and tells you which one.
What is the difference between PNG and SVG?
PNG is a normal picture for slides, documents and social media. SVG is a vector file: it stays sharp at any size and you can edit it in Illustrator, Inkscape, Figma or PowerPoint.
Is my data uploaded?
No. The diagram is made in your browser, on your own device.
Good to know
- Hold the mouse over a flow or a box to see its exact amount
- The PNG is saved at twice the chosen size, so it is sharp on slides and big screens
- For bar, line and pie charts, use the Chart Maker
Related tools
- Chart Maker — bar, line, area and pie charts
- Word Cloud Generator — a picture of the most used words
- Percentage Calculator — work out shares of a total
- Statistics Calculator — mean, median and more
- Image to SVG — turn a picture into a vector
- Screenshot Beautifier — a nice frame for your chart
