The Phosphor align left simple icon depicts text or elements aligned to the left margin, commonly used in text editors or layout tools to set left alignment.
Common uses
- Set text to left-align in a rich text editor.
- Align a block of content to the left edge of its container.
- Control the horizontal positioning of UI elements.
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { AlignLeftSimple } from '@phosphor-icons/react';
<AlignLeftSimple size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<AlignLeftSimple size={24} />thin
<AlignLeftSimple size={24} weight="thin" />light
<AlignLeftSimple size={24} weight="light" />bold
<AlignLeftSimple size={24} weight="bold" />fill
<AlignLeftSimple size={24} weight="fill" />duotone
<AlignLeftSimple size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- design
- Keywords
- alignmentarrangementlayoutflush leftdesigneditoralignleftsimpleleft aligntext align leftalign leftleft justify
FAQ
- What does the align left simple icon represent?
- It represents the action or state of aligning content to the left, often used for text or block elements in user interfaces.
- How do I use this icon in React?
- You can import and use it in your React application like this: import { AlignLeftSimple } from '@phosphor-icons/react'.
- What is the license for this icon?
- The Phosphor icon library, including this icon, is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Phosphor.
Looking for something else? Search Phosphor 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 →