What does the collapse icon signify?

It signifies the action of reducing or hiding elements, often used to save space or simplify a complex interface.

How do I use the CollapseIcon in React?

Import both HugeiconsIcon and CollapseIcon, then render .

What is the license for this icon?

The HugeIcons library, including the CollapseIcon, is distributed under the MIT license.

collapse icon

HugeIcons · CollapseIcon · MIT

The HugeIcons collapse icon visually represents the action of reducing or hiding content, commonly used to condense sections of a user interface.

Common uses

Collapsing sidebars or navigation menus
Minimizing expandable content sections
Toggling accordion panels

Use it in React

Install

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

Import & render

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

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

Details

Library: HugeIcons (5,121 icons)
License: MIT
viewBox: 0 0 24 24
Keywords: minimizecontractreducehide

FAQ

What does the collapse icon signify?: It signifies the action of reducing or hiding elements, often used to save space or simplify a complex interface.
How do I use the CollapseIcon in React?: Import both HugeiconsIcon and CollapseIcon, then render <HugeiconsIcon icon={CollapseIcon} />.
What is the license for this icon?: The HugeIcons library, including the CollapseIcon, is distributed under the MIT license.

Related icons

The same idea in other libraries, and near matches in 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 →