Grid Pattern
Installation
npx shadcn@latest add "https://magicui.design/r/grid-pattern"Examples
Linear Gradient
Grid Pattern
Dashed Stroke
Grid Pattern
Props
GridPattern
| Prop | Type | Default | Description |
|---|---|---|---|
width | number | 40 | Width of the pattern |
height | number | 40 | Height of the pattern |
x | number | -1 | X offset of the pattern |
y | number | -1 | Y offset of the pattern |
squares | number | [] | X Y coordinates of filled squares as 2D array |
strokeDasharray | string | 0 | Stroke dash array for the pattern |