安装
示例
线性渐变
带发光效果
用法
import { DotPattern } from "@/components/magicui/dot-pattern";
<div className="relative h-[500px] w-full overflow-hidden">
<DotPattern />
</div>
属性
点阵图案
属性 | 类型 | 默认值 | 描述 |
---|---|---|---|
宽度 | any | 16 | 点阵图案的宽度 |
高度 | any | 16 | 点阵图案的高度 |
x | any | 0 | 点的 X 坐标 |
y | any | 0 | 点的 Y 坐标 |
cx | any | 1 | 圆的 X 坐标 |
cy | any | 1 | 圆的 Y 坐标 |
cr | any | 1 | 圆的半径 |
className | string | - | 点阵图案的类名 |
glow | boolean | false | 激活点阵图案的发光效果 |