Blocks Pixel Art Icon
A blocks icon for modular code, package managers, component libraries, building-block UI systems, and plugin registries.
Style variants
base
Outline · rounded corners
sharp
Outline · sharp corners
Base, sharp, solid or glyph: see how the four styles differ and which to use.
About the Blocks icon
Interlocking or stacked blocks representing modular components or packages. It suits a 'Component library' section in a design system tool, a 'Packages' or 'Dependencies' panel in an IDE, or a 'Plugins' page in an app marketplace. The blocks metaphor implies things that snap together and are reusable rather than monolithic. For a single atomic component, a single-block or box icon may be cleaner; blocks implies a collection or system of reusable units.
Usage
<!-- HTML -->
<img src="pixelarticons/svg/blocks.svg" width="24" height="24" alt="Blocks" />
<!-- React -->
import { Blocks } from 'pixelarticons/react'
<!-- Sizes: 24px, 48px, 72px, 96px (multiples of 24) -->
<img src="blocks.svg" width="48" height="48" style="image-rendering: pixelated" />