John KuehJohn Kueh

arrow down left icon

Phosphor · arrow-down-left · MIT

Download SVG

The Phosphor arrow down left icon depicts a diagonal arrow pointing downwards and to the left, commonly used to indicate a downward and leftward direction or action.

Common uses

  • Navigating to a previous or lower section
  • Indicating a download or import action
  • Representing a decrease or negative trend

Use it in React

Install
npm i @phosphor-icons/react
Import & render
import { ArrowDownLeft } from '@phosphor-icons/react';

<ArrowDownLeft size={24} />

Styles

Phosphor ships this icon in 6 styles — each its own import:

regular
<ArrowDownLeft size={24} />
thin
<ArrowDownLeft size={24} weight="thin" />
light
<ArrowDownLeft size={24} weight="light" />
bold
<ArrowDownLeft size={24} weight="bold" />
fill
<ArrowDownLeft size={24} weight="fill" />
duotone
<ArrowDownLeft size={24} weight="duotone" />

Details

Library
Phosphor (1,512 icons)
License
MIT
viewBox
0 0 256 256
Category
arrows
Keywords
directionalpointerpointingarrowheadarrowsarrowdownleftdiagonal arrow down leftsouthwest arrowdownload arrow left

FAQ

What is the arrow down left icon used for?
It's used to signify a direction that is both down and to the left, often for navigation, downloads, or indicating a decrease.
How do I use the arrow down left icon in React?
You can import and use it in React with: import { ArrowDownLeft } from '@phosphor-icons/react'.
What is the license for this icon?
The Phosphor icon library, including the arrow down left 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 →