背景样式
收集常用页面背景模板，覆盖网格、纹理、技术感和轻量动态背景。
AI Studio
A tactile landing background with vertical strips, soft gradient fills, and subtle texture.
背景详情
- 分类
- 纸感纹理
- 适用
- 参考 Aceternity Noise Grid，适合 AI 工具和创意产品首页。
Tailwind 背景类
bg-[repeating-linear-gradient(to_right,rgba(241,245,249,0.92)_0_78px,rgba(203,213,225,0.55)_78px_79px,rgba(255,255,255,0.88)_79px_160px),radial-gradient(circle_at_50%_20%,rgba(20,184,166,0.18),transparent_42%),linear-gradient(to_bottom,#ffffff,#f8fafc)] bg-[radial-gradient(ellipse_at_center,rgba(255,255,255,0.16)_0%,rgba(255,255,255,0.38)_48%,rgba(255,255,255,0.86)_100%)]
生成提示词
请为 [页面名称/业务场景] 设计一个「噪声竖条」背景样式。 适用场景： - 参考 Aceternity Noise Grid，适合 AI 工具和创意产品首页。 视觉目标： - A tactile landing background with vertical strips, soft gradient fills, and subtle texture. 背景实现： 1. 主背景使用：bg-[repeating-linear-gradient(to_right,rgba(241,245,249,0.92)_0_78px,rgba(203,213,225,0.55)_78px_79px,rgba(255,255,255,0.88)_79px_160px),radial-gradient(circle_at_50%_20%,rgba(20,184,166,0.18),transparent_42%),linear-gradient(to_bottom,#ffffff,#f8fafc)] 2. 覆盖层使用：bg-[radial-gradient(ellipse_at_center,rgba(255,255,255,0.16)_0%,rgba(255,255,255,0.38)_48%,rgba(255,255,255,0.86)_100%)] 实现要求： 1. 使用 CSS 或 Tailwind arbitrary values 实现，不依赖图片素材。 2. 背景必须放在内容层下方，正文和按钮要保持清晰可读。 3. 保持浅色、克制、可复用，不要出现大面积高饱和装饰。 4. 如果用于 Hero，背景需要从首屏自然过渡到下一段内容。 5. 如果用于工具或后台页面，背景只承担氛围和分区提示，不干扰操作密度。