SUSupaUI

Layout

Stack · Cluster · Grid

Three composition primitives. Vertical rhythm, horizontal wrap, fluid columns.

Install

bash
npx shadcn@latest add https://supaui.dev/r/layout.json

Stack — vertical rhythm

Row one
Row two
Row three

Cluster — horizontal wrap

EditorialNowBetaLowWatchHot

Grid — fluid columns

cell 1
cell 2
cell 3
cell 4
cell 5
cell 6

API

  • Stack — gap 0/1/2/3/4/6/8/10/12/16, align start/center/end/stretch.
  • Cluster — gap, align start/center/end/baseline, justify start/center/end/between.
  • Grid — cols 1/2/3/4/5/6/12 (responsive defaults baked in), gap.