Separator
Visually or semantically separates content.
Last updated: March 8, 2026
This page now includes separator patterns for layout hierarchy, visual style, and decorative content flow.
Basic Separator
Simple horizontal divider between content sections.
Basic Separator
Simple horizontal divider between content sections.
Content below separator
Vertical Separator
Vertical separators for inline navigation and actions.
Colored Separator
Color-accented separators to communicate emphasis.
Blue Separator
Red Separator
Green Separator
Dashed Separator
Dashed line divider for low-emphasis section breaks.
Dashed Border
Visual separation with dashes
Content after dashed line
Dotted Separator
Decorative dotted line separator.
Dotted Border
Decorative dotted separator
Content below dotted line
Thick Separator
Bold separator for stronger visual hierarchy.
Thick Divider
Bold visual separation
Section below
Separator With Text
Centered text divider commonly used in auth and forms.
Popular divider for authentication flows
Gradient Separator
Multi-color separator for expressive sections.
Gradient Separator
Multi-color visual divider
Stylish gradient divider
Shadow Separator
Divider with depth using subtle shadow.
Shadow Divider
Separator with depth
Content with shadow effect
Spacer Separator
Minimal separator that adds breathing room.
Spacer Divider
Minimal line with padding
Creates breathing room between sections
Animated Separator
Animated visual separator for dynamic UIs.
Animated Separator
Dynamic expanding line
Eye-catching divider
Icon Separator
Decorative separator with a centered symbol.
Icon Divider
Separator with centered icon
Decorative icon separator
Double Separator
Parallel dual-line separator.
Double Separator
Parallel dividing lines
Elegant double-line divider
Wavy Separator
Organic curved separator using SVG.
Wavy Separator
Curved organic divider
Organic curved divider
Rainbow Separator
Vibrant color-stripe decorative separator.
Rainbow Separator
Colorful multi-stripe divider
Vibrant rainbow divider
Glow Separator
Neon-style glowing separator.
Glow Separator
Luminous divider effect
Glowing neon-like divider
Dashed Vertical Separator
Vertical dashed separator for split content blocks.
Feature 1
Description
Feature 2
Description
Chevron Separator
Directional chevron-style separator.
Chevron Separator
Directional divider
Directional chevron divider
Blur Separator
Soft blurred gradient divider.
Blur Separator
Frosted glass effect
Soft blurred divider