The Phosphor dots three icon depicts three vertically aligned dots, commonly used to represent a menu, overflow options, or a 'more' action in user interfaces.
Common uses
- Vertical dropdown menu trigger
- Overflow menu button
- 'More options' indicator
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { DotsThree } from '@phosphor-icons/react';
<DotsThree size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<DotsThree size={24} />thin
<DotsThree size={24} weight="thin" />light
<DotsThree size={24} weight="light" />bold
<DotsThree size={24} weight="bold" />fill
<DotsThree size={24} weight="fill" />duotone
<DotsThree size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- system
- Keywords
- menuoverflowcirclesshapespolygons3ellipsisellipsesmoresystemdotsthreeellipsis verticalmore optionsvertical menukebab menu
FAQ
- What is the dots three icon used for?
- It's typically used to indicate that there are more options or actions available, often opening a menu or list when clicked.
- How do I use the dots three icon in React?
- You can import and use it like this: import { DotsThree } from '@phosphor-icons/react'; <DotsThree />
- What is the license for Phosphor icons?
- Phosphor icons are distributed under the MIT license, which allows for free use in both personal and commercial projects.
Related icons
The same idea in other libraries, and near matches in Phosphor.