Compare
GraphCompare
Feature matrix. Cells are text or true/false, drawn as ✓ and –.
Command
pnpm dlx shadcn@latest add <origin>/r/graph-compare.jsonPlans
Booleans become checkmarks. Studio is the highlighted column.
SoloStudio
- Registry✓✓
- Accent picker✓✓
- Private source–✓
- Price$0$24
Before after
Three columns. Text cells stay as text.
MermaidSVGThis
- Source.md.svg.tsx
- In git✓–✓
- Themable––✓
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | — | Caption drawn on the top edge of the frame. |
| columns | string[] | — | Option names across the top. |
| rows | CompareRow[] | — | label plus one value per column. Booleans become ✓ or –. |
| accent | string | — | Column name to highlight. Other columns recede. |
| corner | string | "+" | Character at each corner of the frame. |
| className | string | — | Passed to the outer frame. |