
Build without the clutter.
One library. Every interface worth shipping.
Take the fast lane to mastery.
Three rows of paired cards that split apart to uncover the message behind them. Each row is pushed a different distance, height, and angle, so the pairs fan away at their own rates rather than sliding as one wall. The centered block behind them pops its badge from zero, rolls three lines up from behind their own masks, and lifts the button in last on a short delay.
npx shadcn@latest add @compronents/card-parting-revealInstalls from ui.aryank.space. Needs a registry token and a one-time @compronents entry in components.json. The docs walk through both.
| Prop | Type | Default | Description |
|---|---|---|---|
| images | string[] | 6 BLANK stills | Consumed in pairs, one left and one right per row. |
| heroImage / badgeImage | string | Blob-hosted marks | The opening plate and the circular badge behind the rows. |
| lines / buttonLabel / footerLink | string[] / string | BLANK copy | Revealed copy and the closing link. |
| embedded | boolean | true | Own the scroll container so it fits a bounded box. Set false to drive it from the window scroll. |
lines / buttonLabeltextThe three revealed lines and the call to action.
gsaplenis