The Lucide separator horizontal icon visually represents a horizontal line, commonly used to divide content or create visual separation between elements on a user interface.
Common uses
- Dividing sections in a form
- Separating list items
- Creating visual breaks in a dashboard layout
Use it in React
Install
npm i lucide-reactImport & render
import { SeparatorHorizontal } from 'lucide-react';
<SeparatorHorizontal size={24} />Details
- Library
- Lucide (1,713 icons)
- License
- ISC
- viewBox
0 0 24 24- Keywords
- movesplitseparatorhorizontalhorizontal ruledividerlinespacer
FAQ
- What is the purpose of the separator horizontal icon?
- It's used to visually divide content or elements, improving layout clarity and organization on a screen.
- How do I use this icon in React?
- You can import and use it like this: import { SeparatorHorizontal } from 'lucide-react'. Then render it as <SeparatorHorizontal />.
- What is the license for this icon?
- The Lucide icon library, including the separator horizontal 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 →