React Separator Components

Dev Design Library indexes 57 React separator components from 39 open-source UI libraries, with the most coming from Shadcn Space, ReUI, pdfcn, Cojeev UI and glasscn. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list targets React. Separator components belong to the Layout group.

• Separatorshadcn/ui · ReactVisually or semantically separates content.
• DividerMUI / Material UI · React
• SeparatorChakra UI · ReactUsed to visually separate content
• SeparatorHeroUI · ReactA simple line to separate content visually.
• DividerReact Spectrum · ReactDividers bring clarity to a layout by grouping and dividing content in close proximity. They can also be used to…
• Separatorcoss ui · ReactA separator element accessible to screen readers.
• SeparatorRadix Themes · React
• DividerTremor · React
• Horizontal separator for content sections.ReUI · ReactHorizontal separator for content sections.
• Dividerpdfcn · ReactDivider PDF component (forme)
• DividerLobe UI · React
• separatorIntent UI · Reactseparator
• Section DividerUntitled UI React · React
• SeparatorTailGrids · ReactA separator component to separate content.
• SeparatorVengeance UI · React
• SeparatorToolcraft · React
• SeparatorPanel UI · React NativeHorizontal or vertical rule between content, optionally labelled.
• Button Group-04 - SeparatorShadcn Space · ReactButton group with separators
• DividerBoardUI · ReactSingle, double, and filled content separators.
• DividerTremor Blocks · React
• SeparatorShadcn Dashboard · React
• SeparatorObsidianUI · React
• dB Scaleaudiocn · ReactTick marks and labels for a decibel range, shared by meters and faders.
• SeparatorShark UI · ReactVisually separate content with a line.
• SeparatorWatermelon UI · React
• Glass Separatorglasscn · ReactGlass Separator with five variants: clear, frosted, subtle, liquid, and liquid-refract
• MarkerHextaUI · ReactQuiet notes between content, like date dividers and system events, with sticky dates and times that read as Today or…
• MarkerCojeev UI · ReactSeparates or annotates a sequence with a short event, status, or time label.
• SeparatorROI UI · ReactA separator element accessible to screen readers.
• DividerHalaska UI · React
• RuleMetal UI · React + SwiftUIAn engraved groove between groups; graphite on dark chrome.
• SeparatorSpaceUI · ReactDraws clean horizontal or vertical dividing lines between content blocks or tools to create clear visual separation.
• Aria SeparatorReScript shadcn · ReScript
• SeparatorOUI · ReactReact aria components Separator with shadcn characteristics.
• Liquid DividerLiquefy UI · ReactDivider line in liquid glass style. Linha divisória em estilo vidro líquido.
• SeparatorD2Studio UI · ReactVisually or semantically separates content.
• SeparatorFibo · ReactA thin rule between groups of content, across or down, with an optional label.
• DividerReactFrame · ReactA horizontal or vertical divider with solid, dashed, dotted and gradient styles, an optional label with start, center…
• Separatorark-cn · ReactA shadcn-style separator component built with Ark UI primitives.
• Vertical separator for inline elements.ReUI · ReactVertical separator for inline elements.
• Dividerpdfcn · ReactDivider PDF component (takumi)
• Input OTP-03 - With SeparatorShadcn Space · ReactInput OTP component with separator between segments
• Separatorglasscn · React
• SeparatorHextaUI · ReactA hairline that divides content horizontally or vertically, with an optional label and a decorative mode for purely…
• SeparatorCojeev UI · ReactDivides adjacent content with a horizontal or vertical rule.
• Base SeparatorReScript shadcn · ReScript
• Vertical separator groups related menu items.ReUI · ReactVertical separator groups related menu items.
• Select-09 - Select with separatorShadcn Space · ReactSelect component
• Horizontal separator between items in a list.ReUI · ReactHorizontal separator between items in a list.
• Separator 01 - DefaultShadcn Space · ReactBasic horizontal separator dividing content sections
• Separator with centered text labelReUI · ReactSeparator with centered text label
• Separator 02 - VerticalShadcn Space · ReactVertical separators between stat columns with label and value
• Order summary with separatorsReUI · ReactOrder summary with separators
• Separator 03 - Horizontal Label PlacementShadcn Space · ReactHorizontal separators with inline start, center, and end text labels
• Separator 04 - Vertical Label PlacementShadcn Space · ReactVertical separators with top, center, and bottom text labels
• Separator 05 - DashedShadcn Space · ReactDashed horizontal separator
• Separator 06 - Gradient FadedShadcn Space · ReactGradient faded horizontal separator that fades from transparent to border color

Libraries with React separator components

• Shadcn Space
• ReUI
• pdfcn
• Cojeev UI
• glasscn

Related categories

• Separator Components
• Tailwind CSS Separator Components
• Svelte Separator Components
• shadcn/ui Separator Components
• React Layout Components
• React Grid Components
• React Bento Grid Components
• React App Shell Components
• React Stack Components
• React Split Pane Components
• React Window Frame Components
• React Masonry Components