The Phosphor arrow fat lines left icon depicts a thick, outlined arrow pointing to the left, commonly used to indicate navigation back to a previous state or section.
Common uses
- Back button in a wizard or multi-step form
- Navigate to the previous page in a pagination control
- Collapse a sidebar or panel
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { ArrowFatLinesLeft } from '@phosphor-icons/react';
<ArrowFatLinesLeft size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<ArrowFatLinesLeft size={24} />thin
<ArrowFatLinesLeft size={24} weight="thin" />light
<ArrowFatLinesLeft size={24} weight="light" />bold
<ArrowFatLinesLeft size={24} weight="bold" />fill
<ArrowFatLinesLeft size={24} weight="fill" />duotone
<ArrowFatLinesLeft size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- arrows
- Keywords
- directionalpointerpointingarrowheadoutlinedarrowsarrowfatlinesleftback arrowprevious iconthick left arrowmove left
FAQ
- What is the arrow fat lines left icon used for?
- It's typically used for navigation actions that move backward, such as going back to a previous screen or collapsing an element.
- How do I use the arrow fat lines left icon in React?
- Import it from the library like this: import { ArrowFatLinesLeft } from '@phosphor-icons/react'. Then use it as a component: <ArrowFatLinesLeft size={32} />.
- What is the license for the Phosphor arrow fat lines left 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 →