The Tabler box margin icon depicts a box with outer spacing, commonly used to represent CSS margin properties that define the space around an element's border.
Common uses
- Setting margin in a CSS editor
- Adjusting spacing around a content block
- Visualizing layout padding and margins
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconBoxMargin } from '@tabler/icons-react';
<IconBoxMargin size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Design
- Keywords
- csscascadingstylesectionspacetextcontentoutsidecontainerboxdesignmargincss marginspacinglayoutpadding
FAQ
- What does the box margin icon represent?
- It visually signifies the concept of 'margin' in web design and CSS, which is the space outside an element's border.
- How do I use this icon in React?
- You can import and use it like this: import { IconBoxMargin } from '@tabler/icons-react'. Then, render it as <IconBoxMargin />.
- What is the license for this icon?
- This icon is from the Tabler icon library and 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 →