Pixelarticons

Align Horizontal Distribute Start Pixel Art Icon

A distribute-starts-horizontally icon for spacing elements evenly by their leading edges in design tools.

design Free 4 variants

Tags

alignhorizontaldistributestart

Style variants

base

Outline · rounded corners

sharp

Outline · sharp corners

glyph

Filled · sharp corners

Get Pro

solid

Filled · rounded corners

Get Pro

Base, sharp, solid or glyph: see how the four styles differ and which to use.

About the Align Horizontal Distribute Start icon

Objects whose left (leading) edges are placed at equal horizontal intervals, the 'Distribute starts horizontally' alignment action. Use it in a design tool or layout editor when you want equal spacing measured from each element's leftmost edge rather than its center or trailing edge. This differs from distribute-center (midpoints) and distribute-end (trailing edges). It is a precision alignment control best suited to design applications rather than general UI patterns.

Usage

<!-- HTML -->
<img src="pixelarticons/svg/align-horizontal-distribute-start.svg" width="24" height="24" alt="Align Horizontal Distribute Start" />

<!-- React -->
import { AlignHorizontalDistributeStart } from 'pixelarticons/react'

<!-- Sizes: 24px, 48px, 72px, 96px (multiples of 24) -->
<img src="align-horizontal-distribute-start.svg" width="48" height="48" style="image-rendering: pixelated" />

Related icons