The Phosphor box arrow down icon visually represents the action of downloading or saving a file or data, often used to indicate a download button or an archive function.
Common uses
- Download button for files
- Archive item action
- Save to local storage
Use it in React
Install
npm i @phosphor-icons/reactImport & render
import { BoxArrowDown } from '@phosphor-icons/react';
<BoxArrowDown size={24} />Styles
Phosphor ships this icon in 6 styles — each its own import:
regular
<BoxArrowDown size={24} />thin
<BoxArrowDown size={24} weight="thin" />light
<BoxArrowDown size={24} weight="light" />bold
<BoxArrowDown size={24} weight="bold" />fill
<BoxArrowDown size={24} weight="fill" />duotone
<BoxArrowDown size={24} weight="duotone" />Details
- Library
- Phosphor (1,512 icons)
- License
- MIT
- viewBox
0 0 256 256- Category
- office
- Keywords
- savedsavingarchivedarchivingarchivaldownloadeddownloadingofficesystemboxarrowdowndownloadsavearchiveexport
FAQ
- What does the box arrow down icon represent?
- It signifies downloading, saving, or archiving content. It's commonly used for buttons that initiate these actions.
- How do I use the box arrow down icon in React?
- Import it from the library and use it as a component: `import { BoxArrowDown } from '@phosphor-icons/react'; <BoxArrowDown />`.
- What is the license for this icon?
- The Phosphor icon set, including the box arrow down 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 →