Close Pixel Art Icon
An X close icon for dismissing modals, closing panels, removing tags and clearing selections throughout any application.
Tags
canceldismiss
Style variants
Base, sharp, solid or glyph: see how the four styles differ and which to use.
About the Close icon
A simple X formed by two diagonal lines crossing at the center, the most universally understood 'dismiss' control in interface design. It closes dialogs, collapses sidebars, removes selected tags in filter chips, and clears an input field. Because users rely on muscle memory to find it, placement matters: the top-right corner of a card or modal is the expected location. For stopping a running process rather than dismissing a surface, a 'stop' or 'cancel' icon carries the right semantic weight.
Usage
<!-- HTML -->
<img src="pixelarticons/svg/close.svg" width="24" height="24" alt="Close" />
<!-- React -->
import { Close } from 'pixelarticons/react'
<!-- Sizes: 24px, 48px, 72px, 96px (multiples of 24) -->
<img src="close.svg" width="48" height="48" style="image-rendering: pixelated" />