Heatmap Generator

Turn a pasted matrix of numbers into a colour heatmap with a scale legend.

Build a heatmap

Rows: 0
Columns: 0
Smallest value: —
Largest value: —
The heatmap is built as an SVG string and inserted into the page on your device.

How to use the Heatmap Generator

  1. Paste your grid of numbers, one row per line.
  2. Choose the colour scale you want the heatmap to use.
  3. Click Draw heatmap, then copy the SVG if you need it.

Features

Advertisement

Frequently Asked Questions

Common questions about the free online heatmap generator.

Paste your grid with one row per line, pick a colour scale and click Draw heatmap to render the matrix as coloured cells.
Separate the values in each row with commas, spaces, semicolons or tabs, and start a new line for each row of the matrix.
The smallest value in the grid maps to the first colour of the scale and the largest to the last, with the rest spread evenly between.
When every value is identical the middle colour of the scale is used for all cells, and the scale legend shows that single value.
Yes. Rows may hold a different number of values, and the grid is drawn as wide as the longest row you paste.
Yes. Click Copy SVG to copy the whole drawing, then paste it into an HTML file, an SVG file or a design tool.
No. The matrix is parsed and the SVG is built locally in your browser, so nothing leaves your device.
Yes. It is completely free with no account, no sign-up, no watermark and no limit on how many maps you draw.

Last updated: October 10, 2026