The Phosphor shapes icon depicts a collection of basic geometric forms and is typically used to represent design tools, shape manipulation options, or general design-related concepts in a user interface.
Common uses
- Button to open a shape editing tool
- Menu item for 'Insert Shape'
- Label for a design settings section
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { Shapes } from '@phosphor-icons/react';
<Shapes size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<Shapes size={24} />thin
<Shapes size={24} weight="thin" />light
<Shapes size={24} weight="light" />bold
<Shapes size={24} weight="bold" />fill
<Shapes size={24} weight="fill" />duotone
<Shapes size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- design
- Keywords
- geometrysquarecircletriangledesignshapesdesign toolsbasic shapesform
FAQ
- What is the Phosphor shapes icon used for?
- It represents geometric shapes and is commonly used for design tools, shape manipulation, or general design concepts in UIs.
- How do I use the shapes icon in React?
- Import it as `Shapes` from '@phosphor-icons/react' and use it as a React component: `<Shapes />`.
- What is the license for the Phosphor shapes icon?
- The Phosphor icon library, including the shapes 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 →