The Tabler square rotated icon depicts a square tilted on its corner, often used to represent a diamond shape or a rotated element in UI design.
Common uses
- Displaying a diamond shape in a UI element.
- Indicating a rotated or transformed state.
- Representing a rhombus or tilted square in diagrams.
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconSquareRotated } from '@tabler/icons-react';
<IconSquareRotated size={24} stroke={2} />Styles
Tabler ships this icon in 2 styles — each its own import:
outline
<IconSquareRotated size={24} stroke={2} />filled
<IconSquareRotatedFilled size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Shapes
- Keywords
- shapesigngeometrygeometricquadrilateralrhombussquarerotatedrectangularformshapesdiamondtilted squarerotated shape
FAQ
- What is the square rotated icon used for?
- It's typically used to represent a diamond shape, a rhombus, or a square that has been rotated by 45 degrees in user interfaces.
- How do I use the square rotated icon in React?
- You can import and use it in your React application with: import { IconSquareRotated } from '@tabler/icons-react'
- What is the license for the square rotated icon?
- The Tabler icon library, including the square rotated icon, is 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 →