Grids & Layouts
Scatter Deck
Scattered card deck feature grid with random positioning.
featurescatterdeckrandom
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
cards | Array<{title: string, color: string, rotate: number, z: number}> | [{title: 'Motion', color: 'bg-[#ff4d4d]', rotate: -5, z: 10}, ...] | Array of card objects with title, color (Tailwind class), rotation angle, and z-index. |
backgroundColor | string | #e5e5e5 | Background color (hex, rgb, or hsl). |
gridSize | number | 400 | Grid size in pixels for positioning. |
dragText | string | Drag Me | Text displayed on draggable cards. |
backgroundText | string | SCATTER | Background text pattern. |