Masi Aceleração

Separator

Linha divisória visual e semântica para separar grupos de conteúdo horizontal ou verticalmente.

Visão geral

O Separator é uma linha semântica (hr/div com role=separator) com suporte a orientação.

Horizontal (padrão)

Seção A

Conteúdo da seção A.

Seção B

Conteúdo da seção B.

Vertical

Blog

Docs

GitHub

Import

import { Separator } from "@aceleracao/components/ui/separator"

Padrão de implementação

Snippets para uso do Separator.

Separator básico

<Separator />  // horizontal
<Separator orientation="vertical" />  // vertical

Cor customizada

<Separator className="bg-border" />     // cor padrão
<Separator className="bg-primary/20" /> // primária suave
<Separator className="bg-card" />      // camada do card (para sections)

Design System PAM - Criado por Chuv Studio