安装
示例
线性渐变
虚线描边
用法
import { GridPattern } from "@/components/magicui/grid-pattern";<div className="relative h-[500px] w-full overflow-hidden">
<GridPattern />
</div>属性
GridPattern
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
宽度 | number | 40 | 图案宽度 |
高度 | number | 40 | 图案高度 |
x | number | -1 | 图案的X轴偏移 |
y | number | -1 | 图案的Y轴偏移 |
squares | number | [] | 填充方块的X Y坐标（二维数组） |
strokeDasharray | string | 0 | 图案的描边虚线数组 |