align center horizontal simple icon

Common uses

• Centering text in a text editor toolbar.
• Aligning form elements horizontally in a settings panel.
• Positioning a modal dialog in the horizontal center of the screen.

Use it in React

npm i @phosphor-icons/react

import { AlignCenterHorizontalSimple } from '@phosphor-icons/react';

<AlignCenterHorizontalSimple size={24} />

Styles

Phosphor ships this icon in 6 styles — each its own import:

<AlignCenterHorizontalSimple size={24} />

<AlignCenterHorizontalSimple size={24} weight="thin" />

<AlignCenterHorizontalSimple size={24} weight="light" />

<AlignCenterHorizontalSimple size={24} weight="bold" />

<AlignCenterHorizontalSimple size={24} weight="fill" />

<AlignCenterHorizontalSimple size={24} weight="duotone" />

Details

Library

Phosphor (1,512 icons)

License

MIT

viewBox

0 0 256 256

Category

design

Keywords

alignmentarrangementlayoutcenteredmiddledesigneditoraligncenterhorizontalsimplehorizontal centercenter align middlelayout centeralign middle

FAQ

What does the align center horizontal simple icon represent?

This icon depicts the action of aligning multiple objects or content to the horizontal center of their available space. It's used in design and editing tools to manage layout.

How do I use this icon in React?

You can import and use it in your React application with: import { AlignCenterHorizontalSimple } from '@phosphor-icons/react'. Then render it as <AlignCenterHorizontalSimple size={24} />.

What is the license for this icon?

The Phosphor icon library, including this icon, is available under the MIT license, allowing for free use in commercial and non-commercial projects.

Related icons

The same idea in other libraries, and near matches in Phosphor.