YL
BACKGROUND & DECOR

背景与装饰 UI 设计模式

背景与装饰(Background & Decor)分类收录 12 种常用界面模式:噪点颗粒、网格背景、点阵背景、极光光斑背景、径向聚光背景、有机气泡形状等,每条含中英文学名、效果预览与可复制的 AI 设计提示词。

背景与装饰

Background & Decor

12 条

噪点颗粒

Noise / Grain Overlay

噪点颗粒质感渐变

一层细密的半透明噪点盖在渐变上,消除色带、增加"胶片感"。

网格背景

Grid Background

网格背景蓝图技术感

1px 浅线画出的方格网,配中心径向淡出——设计工具感的背景。

点阵背景

Dot Grid Pattern

点阵波点背景轻盈

比网格线更柔和的点阵,radius 1-2px 的圆点按 16-24px 间距铺开。

极光光斑背景

Aurora Glow Background

光斑极光氛围模糊

两三颗大号高斯模糊彩色圆球在角落缓慢漂移,深色页面的氛围担当。

径向聚光背景

Radial Spotlight

聚光舞台深色发布页

一束从顶部打下来的椭圆光,中心亮四周暗——产品发布页的舞台感。

有机气泡形状

Blob Shapes

气泡有机插画液态

不规则圆角(border-radius 八值语法)的色块,像液体一样缓慢变形。

圆锥渐变背景

Conic Gradient Background

圆锥色轮旋转流光

绕中心旋转的色轮,配深色径向蒙版——中心内容、边缘流光。

网格淡出光晕

Grid Fade + Top Glow

网格光晕Hero渐隐

网格从顶部渐隐消失,顶部再压一团品牌色光晕——SaaS Hero 的标配背景。

光束射线

Light Rays / Sunburst

光束放射仪式感复古

从顶部一点放射出明暗相间的光束,复古而隆重的仪式感。

波浪分隔

Wave Divider

波浪分隔曲线柔美

两个色块之间用一道 SVG 波浪衔接,比直线分隔柔美得多。

斜切分隔

Diagonal Divider

斜切分隔动感硬朗

区块之间用一条斜线切割,比波浪硬朗、比直线有动感。

半调网点

Halftone Pattern

半调网点波普复古

圆形蒙版控制网点密度,角落的网点由密到疏渐隐——复古印刷味。