What is the arrow up down icon used for?

It's typically used to represent sorting functionality in tables or to indicate that an item can be moved up or down.

How do I use the ArrowUpDownIcon in React?

Import both HugeiconsIcon and ArrowUpDownIcon, then render .

What is the license for this icon?

This icon is distributed under the MIT license, allowing for free commercial and non-commercial use.

arrow up down icon

HugeIcons · ArrowUpDownIcon · MIT

The HugeIcons arrow up down icon depicts a bidirectional arrow, commonly used to indicate sorting options or a draggable element's direction.

Common uses

Table column sorting
Drag and drop indicator
Expand/collapse toggle

Use it in React

Install

npm i @hugeicons/react @hugeicons/core-free-icons

Import & render

import { HugeiconsIcon } from '@hugeicons/react';
import { ArrowUpDownIcon } from '@hugeicons/core-free-icons';

<HugeiconsIcon icon={ArrowUpDownIcon} size={24} strokeWidth={1.5} />

Details

Library: HugeIcons (5,121 icons)
License: MIT
viewBox: 0 0 24 24
Keywords: sort iconbidirectional arrowdrag iconmove icon

FAQ

What is the arrow up down icon used for?: It's typically used to represent sorting functionality in tables or to indicate that an item can be moved up or down.
How do I use the ArrowUpDownIcon in React?: Import both HugeiconsIcon and ArrowUpDownIcon, then render <HugeiconsIcon icon={ArrowUpDownIcon} />.
What is the license for this icon?: This icon is distributed under the MIT license, allowing for free commercial and non-commercial use.

Related icons

The same idea in other libraries, and near matches in HugeIcons.

lucide hugeicons hugeicons hugeicons hugeicons hugeicons hugeicons hugeicons hugeicons hugeicons hugeicons hugeicons

Looking for something else? Search HugeIcons 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 →