The Lucide align horizontal space around icon visually represents the distribution of items with equal spacing between them and at the ends along a horizontal axis, commonly used for layout adjustments in UI elements.
Common uses
- Distributing buttons evenly in a horizontal toolbar.
- Centering content with consistent padding on a dashboard.
- Arranging cards with equal gaps in a responsive grid.
Use it in React
Install
npm i lucide-reactImport & render
import { AlignHorizontalSpaceAround } from 'lucide-react';
<AlignHorizontalSpaceAround size={24} />Details
- Library
- Lucide (1,713 icons)
- License
- ISC
- viewBox
0 0 24 24- Keywords
- centeritemsflexjustifydistributebetweenalignhorizontalspacearounddistribute horizontalspace evenly horizontalflex justify space aroundalign center horizontal
FAQ
- What does the align horizontal space around icon represent?
- This icon signifies distributing elements horizontally with equal space between each element and also before the first and after the last element.
- How do I use this icon in React?
- You can import and use it in React with: import { AlignHorizontalSpaceAround } from 'lucide-react'.
- What is the license for this icon?
- The Lucide icon library, including this icon, is available under the ISC license.
Related icons
The same idea in other libraries, and near matches in Lucide.
Looking for something else? Search Lucide and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →