The Tabler switch icon depicts a two-way arrow, commonly used to represent toggling between states or options, or indicating a change in direction.
Common uses
- Toggle switch for dark/light mode
- Button to switch between list and grid view
- Navigation control for moving between steps or pages
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconSwitch } from '@tabler/icons-react';
<IconSwitch size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Arrows
- Keywords
- togglearrowsswitchnavigationflowmovementroutepathchangedirection
FAQ
- What is the purpose of the switch icon?
- It visually represents actions like toggling settings, changing views, or indicating a directional change in a process.
- How do I use the switch icon in React?
- Import it using `import { IconSwitch } from '@tabler/icons-react'` and use it as a component: `<IconSwitch />`.
- What is the license for the Tabler switch icon?
- The Tabler icons, including the switch icon, are available under the MIT license.
Related icons
The same idea in other libraries, and near matches in Tabler.
Looking for something else? Search Tabler 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 →