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