The Phosphor text indent icon visually represents increasing the indentation level of text, commonly used in text editors and design tools to structure content.
Common uses
- Increase text indent in a rich text editor
- Apply indentation to list items
- Adjust paragraph formatting
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { TextIndent } from '@phosphor-icons/react';
<TextIndent size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<TextIndent size={24} />thin
<TextIndent size={24} weight="thin" />light
<TextIndent size={24} weight="light" />bold
<TextIndent size={24} weight="bold" />fill
<TextIndent size={24} weight="fill" />duotone
<TextIndent size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- design
- Keywords
- *updated*alignmenttabmenudesigneditortextindentincrease indentadd tabtext alignment
FAQ
- What does the text indent icon represent?
- It signifies the action of increasing the space between the margin and the start of a text block, often referred to as 'tabbing in'.
- How do I use the text indent icon in React?
- You can import and use it like this: `import { TextIndent } from '@phosphor-icons/react'`. Then render it as `<TextIndent />`.
- What is the license for this icon?
- The Phosphor icon library, including the text indent 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 →