What is the funnel x icon used for?

It's commonly used in user interfaces to signify the action of clearing or resetting filters, sorting, or other applied criteria.

How do I use the funnel x icon in React?

You can import and use it in your React application with: import { FunnelX } from '@phosphor-icons/react'.

Phosphor icons, including the funnel x icon, are distributed under the MIT license.

Phosphor · funnel-x · MIT

The Phosphor funnel x icon depicts a funnel with an 'x' symbol, typically used to indicate the clearing or resetting of applied filters or sorting.

Install

npm i @phosphor-icons/react

Import & render

import { FunnelX } from '@phosphor-icons/react';

<FunnelX size={24} />

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

regular

<FunnelX size={24} />

thin

<FunnelX size={24} weight="thin" />

light

<FunnelX size={24} weight="light" />

bold

<FunnelX size={24} weight="bold" />

fill

<FunnelX size={24} weight="fill" />

duotone

<FunnelX size={24} weight="duotone" />

Library: Phosphor (1,512 icons)
License: MIT
viewBox: 0 0 256 256
Category: editor
Keywords: *new*filtersrefinesortingeditorobjectsfunnelxclear filtersreset filtersfilter offremove filters

What is the funnel x icon used for?: It's commonly used in user interfaces to signify the action of clearing or resetting filters, sorting, or other applied criteria.
How do I use the funnel x icon in React?: You can import and use it in your React application with: import { FunnelX } from '@phosphor-icons/react'.
What is the license for Phosphor icons?: Phosphor icons, including the funnel x icon, are distributed under the MIT license.

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

The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →