The Heroicons adjustments horizontal icon visually represents a set of sliders or controls arranged horizontally, commonly used to indicate settings, filters, or configuration options.
Common uses
- Opening a settings modal
- Applying filters to a list
- Accessing advanced search options
Use it in React
Install
npm i @heroicons/reactImport & render
import { AdjustmentsHorizontalIcon } from '@heroicons/react/24/outline';
<AdjustmentsHorizontalIcon className="size-6" />Styles
Heroicons ships this icon in 4 styles — each its own import:
24/outline
<AdjustmentsHorizontalIcon className="size-6" />24/solid
<AdjustmentsHorizontalIcon className="size-6" />20/solid
<AdjustmentsHorizontalIcon className="size-6" />16/solid
<AdjustmentsHorizontalIcon className="size-6" />Details
- Library
- Heroicons (324 icons)
- License
- MIT
- viewBox
0 0 24 24- Keywords
- adjustmentshorizontalsettingsfiltersoptionscontrols
FAQ
- What is this icon used for?
- This icon is typically used to represent settings, filters, or configuration options that can be adjusted.
- How do I use this icon in React?
- You can import and use it in React with: import { AdjustmentsHorizontalIcon } from '@heroicons/react/24/outline'.
- What is the license for this icon?
- The Heroicons library, including this icon, is available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Heroicons.
Looking for something else? Search Heroicons 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 →