The Lucide arrow left right icon depicts a bidirectional arrow, commonly used to indicate actions like swapping, switching, or reordering items in a user interface.
Common uses
- Toggling between two states
- Initiating a data transfer or sync
- Reordering list items
Use it in React
Install
npm i lucide-reactImport & render
import { ArrowLeftRight } from 'lucide-react';
<ArrowLeftRight size={24} />Details
- Library
- Lucide (1,713 icons)
- License
- ISC
- viewBox
0 0 24 24- Keywords
- bidirectionaltwo-way2-wayswapswitchtransactionreordermove<-->arrowleftrightbidirectional arrowswap icontwo-way arrow
FAQ
- What is the arrow left right icon used for?
- It's typically used to represent actions involving two directions, such as swapping, switching, or reordering elements.
- How do I use the arrow left right icon in React?
- You can import and use it directly in your React components like this: import { ArrowLeftRight } from 'lucide-react'.
- What is the license for the Lucide arrow left right icon?
- The Lucide icon library, including the arrow left right icon, is available under the ISC license.
Related icons
The same idea in other libraries, and near matches in Lucide.
Looking for something else? Search Lucide 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 →