The Tabler layout bottombar icon visually represents a screen or interface with a distinct bar at the bottom, commonly used to signify navigation, toolbars, or persistent controls in a UI.
Common uses
- Bottom navigation bar in mobile apps
- Footer toolbar for actions
- Persistent settings panel at the screen's base
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconLayoutBottombar } from '@tabler/icons-react';
<IconLayoutBottombar size={24} stroke={2} />Styles
Tabler ships this icon in 2 styles — each its own import:
outline
<IconLayoutBottombar size={24} stroke={2} />filled
<IconLayoutBottombarFilled size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Design
- Keywords
- positiondesigngridfooterlayoutbottombarcreativeartisticvisualaestheticbottom toolbarfooter layoutscreen bottombarui footer
FAQ
- What is the layout bottombar icon used for?
- It's used to represent elements that are fixed or persistently displayed at the bottom of a screen, like navigation or toolbars.
- How do I use this icon in React?
- Import it using `import { IconLayoutBottombar } from '@tabler/icons-react'` and then use it as a component: `<IconLayoutBottombar />`.
- What is the license for this icon?
- The Tabler icons, including layout bottombar, are distributed under the MIT license.
Related icons
The same idea in other libraries, and near matches in Tabler.