恭喜您升职!
您的辛勤工作和奉献得到了回报。我们很高兴看到您在职业生涯中迈出新的一步。请继续保持出色的表现!
安装
用法
import { WarpBackground } from "@/components/magicui/warp-background";
<WarpBackground>
<div className="w-80">
<p>Warp Background</p>
<p>This is a component that creates a warp background effect.</p>
</div>
</WarpBackground>
属性
属性 | 类型 | 默认值 | 描述 |
---|---|---|---|
children | React.ReactNode | - | 放置在扭曲动画中的内容 |
透视 | number | 100 | 扭曲动画的透视效果 |
每侧光束数量 | number | 3 | 每侧光束的数量 |
光束大小 | number | 5 | 光束的大小 |
光束最大延迟 | number | 3 | 光束的最大延迟 |
光束最小延迟 | number | 0 | 光束的最小延迟 |
光束持续时间 | number | 3 | 光束的持续时间 |
网格颜色 | string | "var(--border)" | 网格线的颜色 |