The Lucide panel top bottom dashed icon visually represents elements that are divided horizontally with dashed borders, often used to indicate collapsible or expandable sections at the top and bottom of a layout.
Common uses
- Indicating collapsible top/bottom panels in a dashboard.
- Representing expandable content areas in a settings menu.
- Showing dashed dividers between primary content and sidebars.
Use it in React
Install
npm i lucide-reactImport & render
import { PanelTopBottomDashed } from 'lucide-react';
<PanelTopBottomDashed size={24} />Details
- Library
- Lucide (1,713 icons)
- License
- ISC
- viewBox
0 0 24 24- Keywords
- sidebarprimarydrawershowrevealpaddingmarginguidelayouthorizontalbleedpaneltopbottomdashedhorizontal divider
FAQ
- What is the primary purpose of the panel top bottom dashed icon?
- This icon is typically used to signify sections or panels that can be expanded or collapsed, particularly those positioned at the top and bottom of a user interface.
- How do I use this icon in a React application?
- You can import and use it in React with: import { PanelTopBottomDashed } from 'lucide-react'
- What is the license for this icon?
- The Lucide icon library, including this 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 →