Grid icons

9 icons carry the tag grid, across Interface, AI & LLM, Analytics, Data Engineering, Education, Social and Travel. Heatmap, Confusion matrix, Coordinates and 6 more — each in outline and duotone at three weights, with the code for React, Vue, Svelte, Flutter and more.

9 iconsOpen in browser

The 9 grid icons, described

Heatmapchart-heatmap: A heatmap — a grid of cells shaded by how dense or large the values are.
Confusion matrixconfusion-matrix: A confusion matrix — what a classifier got right and which classes it mixed up.
Coordinatescoordinates: The crosshair on the grid — the exact pair of numbers.
Layoutlayout: Layout — where the parts of a page go, the arrangement of its regions.
Masonrymasonry: Tiles of different heights packed into two columns — a masonry grid layout.
Periodic tableperiodic-table: The grid with one element picked out.
Snap to gridsnap-grid: Snap to grid — let go, and the object lands exactly on the dots.
Sudokusudoku: The numbers already filled in.
Tabletable: A table — rows and columns with names across the top, data in a grid.

In code, each is one import — import { ChartHeatmap } from "@iconmind/react/icons/chart-heatmap" — and the same name in Vue, Svelte, Solid, Preact, React Native, Astro, Blade and Flutter.

Tags these icons also carry

cells8 columns9 exact6 layout15 magnet3 rows12 snap4 table15 tiles6

Every grid icon, free to ship

9 of 5,287 icons compiled from one grid — outline and duotone, three weights, every cell generated rather than redrawn. MIT licensed: commercial use, no attribution, no seat count.

All tags Install the package Request an icon