The HugeIcons square arrow left right icon depicts a bidirectional arrow within a square, commonly used to represent actions like switching between two states, toggling visibility, or navigating back and forth.
Common uses
- Toggle sidebar visibility
- Switch between list and grid views
- Navigate to previous/next item
Use it in React
Install
npm i @hugeicons/react @hugeicons/core-free-iconsImport & render
import { HugeiconsIcon } from '@hugeicons/react';
import { SquareArrowLeftRightIcon } from '@hugeicons/core-free-icons';
<HugeiconsIcon icon={SquareArrowLeftRightIcon} size={24} strokeWidth={1.5} />Details
- Library
- HugeIcons (5,121 icons)
- License
- MIT
- viewBox
0 0 24 24- Keywords
- bidirectional arrowtoggle iconswitch iconback and forth arrow
FAQ
- What does the Square Arrow Left Right icon represent?
- This icon represents a bidirectional movement or a toggle between two states. It's often used for actions like switching views or navigating back and forth.
- How do I use the Square Arrow Left Right icon in React?
- Import the icon and use it with the HugeiconsIcon component like this: import { SquareArrowLeftRightIcon } from '@hugeicons/core-free-icons'; render <HugeiconsIcon icon={SquareArrowLeftRightIcon} />.
- What is the license for HugeIcons?
- HugeIcons are provided under the MIT license, which allows for free usage in both personal and commercial projects.
Related icons
The same idea in other libraries, and near matches in 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 →