shadcn_ui-separator

Original：🇺🇸 English

Translated

Visually separate content with ShadSeparator.horizontal and ShadSeparator.vertical; thickness, margin, radius. Use when adding dividers or visual separation in a Flutter shadcn_ui app.

2installs

Sourceserverpod/skills-registry

Added on2026-04-21

NPX Install

npx skill4agent add serverpod/skills-registry shadcn_ui-separator

SKILL.md Content

View Translation Comparison →

Shadcn UI — Separator

Instructions

ShadSeparator

visually or semantically separates content. Use

ShadSeparator.horizontal

for a horizontal line (e.g. between rows); use

ShadSeparator.vertical

for a vertical line (e.g. between columns). Optional:

thickness

margin

radius

color

Horizontal

dart

const ShadSeparator.horizontal(
  thickness: 4,
  margin: EdgeInsets.symmetric(horizontal: 20),
  radius: BorderRadius.all(Radius.circular(4)),
)

Vertical