Low Poly 3D 低多边形 3D(Low Poly 3D)
Low Poly 3D builds scenes from deliberately few polygons and leaves the triangular mesh visible: mountains, animals, and planets are faceted like cut gems, each triangle filled with a single flat shade picked from its angle to the light — no textures, no smooth gradients. The result is jewel-like, faceted lighting you could count by hand. Once a hardware limit of 1990s real-time 3D, it returned in the 2010s as a chosen aesthetic across indie games, wallpapers, and brand illustration.
低多边形 3D 用刻意稀少的多边形搭建场景,并让三角形网格赤裸可见:山峦、动物和星球都像切割过的宝石一样布满刻面,每个三角形只填一种纯色,色值取自它与光源的夹角 —— 没有贴图,没有平滑渐变。结果是一种可以用手指数过来的、宝石般的刻面光照。它曾经是 1990 年代实时 3D 的硬件极限,到了 2010 年代则作为一种主动选择的美学回归,遍布独立游戏、壁纸和品牌插画。
Scope: Covers the faceted-mesh look in UI, illustration, and game-flavored graphics — visible triangles, per-face flat shading, economy of geometry. Not Isometric 3D (regular blocks on a 30° axonometric grid), not Pixel Art (2D raster grid), and not smooth-shaded or photorealistic 3D rendering.
范围:涵盖 UI、插画和游戏感图形里的刻面网格外观 —— 可见的三角形、逐面平涂着色、几何上的节省。不包括等距 3D(30° 轴测网格上的规则方块)、像素艺术(2D 栅格),也不包括平滑着色或照片级写实 3D 渲染。
标本可交互 —— 点点看。Specimen is live — try it.
If you called it…如果你管它叫……
Full style DNA完整风格 DNA
-
Visible triangle mesh可见的三角形网格 geometry defining定义特征
Surfaces are openly built from irregular triangles of varied size; the mesh is the ornament, not something to hide behind textures.
表面大大方方地由大小不一的不规则三角形拼成;网格本身就是装饰,不是要藏进贴图后面的东西。
-
Per-face flat shading逐面平涂着色 surface defining定义特征
Each triangle is filled with ONE solid color derived from its angle to the light; a gradient across a single face is a tell that it isn't low-poly.
每个三角形只填一种纯色,色值取自它与光源的夹角;一个面上出现渐变,就说明它不是低多边形。
-
Deliberately few polygons刻意稀少的多边形 geometry defining定义特征
A mountain reads in 20–100 triangles — you can count the faces. The economy is visible and is the whole point; denser meshes stop reading as low-poly.
一座山用 20–100 个三角形就能读出来 —— 面数少得能数清。这份节省看得见,也正是重点;网格一密就不像低多边形了。
-
Jewel-tone shifted palette宝石色阶配色 color defining定义特征
Hue steps across the scene (teal → violet → coral), each facet a slightly shifted shade of its neighbor, quantizing what would be a gradient into facets.
色相在场景中阶梯式推移(青 → 紫 → 珊瑚橙),每个刻面都是邻近面稍微偏移一点的色号,把本该是渐变的东西量化成刻面。
-
Faceted nature scenes刻面自然场景 imagery supporting辅助特征
Mountains, foxes, deer, trees, planets — the genre's stock subjects are origami-like takes on nature, often floating on a plain ground.
山、狐狸、鹿、树、星球 —— 这个流派的经典题材是折纸感的自然物,常常浮在纯色底上。
-
Crisp facet edges锐利的刻面边缘 surface supporting辅助特征
Facet boundaries are razor-sharp, sometimes hairline-stroked (0.5–1px) in a shade slightly darker than the faces; never soft or glowing.
刻面边界锋利如刀,有时用比面深一号的色号勾 0.5–1px 的发丝线;绝不发软或发光。
-
Slow rigid drift缓慢的刚性漂移 motion variable可变特征
In motion, low-poly scenes rotate slowly, bob, or drift past the camera; the mesh itself stays rigid and never deforms.
动起来时,低多边形场景通常缓慢旋转、上下浮动或从镜头前漂过;网格本身保持刚性,永不变形。
-
Smooth shading or textures平滑着色或贴图 surface avoid避免
Gouraud gradients, photorealistic textures, and smooth high-poly surfaces destroy the effect — if you can't see the triangles, it isn't low-poly.
Gouraud 渐变、照片级贴图和光滑的高模表面会立刻毁掉这个效果 —— 看不见三角形,就不是低多边形。
Often confused with: Isometric 3D最容易混淆:等距 3D(Isometric 3D)
Low Poly 3D低多边形 3D(Low Poly 3D)
Isometric 3D等距 3D(Isometric 3D)
This is Low Poly 3D because the surface is an irregular triangle mesh where every facet gets its own flat shade, creating faceted, jewel-like lighting — not clean rectangular blocks arranged on 30° axonometric axes.
这是低多边形 3D,因为它的表面是一张不规则三角形网格,每个刻面各自分到一种平涂色号,形成宝石般的刻面光照 —— 而不是排列在 30° 轴测轴上的干净矩形方块。
It would become Isometric 3D if the irregular triangles were replaced by regular cubes and extruded rectangles drawn on a 120° axis grid with soft cast shadows — a diagram-like block model instead of a faceted mesh.
如果把不规则三角形换成画在 120° 轴网格上、带柔和投影的规则立方体和拉伸矩形 —— 从刻面网格变成示意图式的方块模型 —— 就变成等距 3D 了。
In code — optional starting points代码写法 —— 可选起点
One flat-shaded facet
clip-path: polygon(50% 0, 100% 100%, 0 100%); background: #7c3aed;
Faceted gem button — hexagon with three flat faces
.gem { clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); background: #6d28d9; }
.gem::before { clip-path: polygon(0 50%, 25% 0, 75% 0, 52% 48%); background: #a78bfa; }
.gem::after { clip-path: polygon(52% 48%, 100% 50%, 75% 100%, 25% 100%, 0 50%); background: #4c1d95; }
Same facet as utilities
bg-[#7c3aed] [clip-path:polygon(50%_0,100%_100%,0_100%)]
Style brief — paste into your agent风格 Brief —— 粘贴给你的代理
Create the surface using Low Poly 3D. Defining signals: every surface is an irregular triangle mesh with per-face flat shading — each facet ONE solid color, never a gradient across a face; visibly low facet counts (a mountain in 20–100 triangles); crisp facet edges, optionally hairline-stroked 0.5–1px darker. Palette: deep indigo ground #14102b/#1b1538; violet mountain facets #4c1d95/#5b21b6/#6d28d9/#7c3aed/#8b5cf6; teal foreground facets #115e59/#0f766e/#0d9488/#14b8a6/#2dd4bf; coral accents #ea580c/#f97316/#fb923c/#fdba74. Pick each facet's shade from its angle to an imagined light — hue IS the lighting. Controls are faceted gems: clip-path hexagons with pseudo-element triangles in lighter/darker flat shades; border-radius 0. Type: geometric sans (system-ui works) 12–14px in #f5f3ff. Depth comes from shade steps between facets — no drop shadows on facets, no textures, no smooth gradients, no rounded blobs. Motion: only a slow rigid drift, off under prefers-reduced-motion. Not Isometric 3D: irregular triangle mesh with per-facet lighting, not rectangular blocks on a 30° grid.
用低多边形 3D 创建界面。定义性信号:每个表面都是不规则三角形网格,逐面平涂着色 —— 每个刻面只填一种纯色,面上绝不出现渐变;面数肉眼可见地少(一座山 20–100 个三角形);刻面边缘锐利,可用深一号的色号勾 0.5–1px 发丝线。配色:深靛底 #14102b/#1b1538;紫色山体刻面 #4c1d95/#5b21b6/#6d28d9/#7c3aed/#8b5cf6;青色前景刻面 #115e59/#0f766e/#0d9488/#14b8a6/#2dd4bf;珊瑚橙点缀 #ea580c/#f97316/#fb923c/#fdba74。按刻面与假想光源的夹角挑选每个面的色号 —— 色相就是光照。控件做成刻面宝石:clip-path 六边形,加伪元素三角形做亮部/暗部平涂面;border-radius 为 0。字体:几何无衬线(system-ui 即可)12–14px,颜色 #f5f3ff。纵深来自刻面之间的色阶差,而不是阴影 —— 刻面上不要投影、不要贴图、不要平滑渐变、不要圆润团块。动效:至多缓慢的刚性漂移,prefers-reduced-motion 下关闭。不要做成等距 3D:区别在于带逐面光照的不规则三角形网格,而不是 30° 网格上的矩形方块。
Accessibility & misuse可访问性与误用
Faceted multicolor backgrounds make text contrast unpredictable — one word can span teal, violet, and coral in a single line. Keep functional text off the mesh on a solid panel, or verify 4.5:1 against the darkest facet it can touch.
刻面多色背景让文字对比度不可预测 —— 一行词可能同时跨过青、紫、珊瑚橙。功能文字要放在网格之外的纯色面板上,或对着它可能碰到的最深刻面验证 4.5:1。
The busy facet pattern raises visual noise and can strain readers with attention or vision difficulties; lower the triangle density behind content, enlarge facets near text, and never animate the mesh behind reading areas.
繁忙的刻面图案抬高视觉噪音,对注意力或视力有困难的读者是种负担;内容后方降低三角形密度,文字附近的刻面放大,阅读区域后面永远不要动。
Slow rotations and parallax drifts are decorative but still vestibular triggers — honor prefers-reduced-motion, and never encode state (loading, playing, progress) in motion alone.
缓慢旋转和视差漂移虽是装饰,仍是前庭触发源 —— 响应 prefers-reduced-motion,且永远别只用动效来编码状态(加载中、播放中、进度)。
Origin起源
The constraint came first: 1990s real-time 3D hardware could only push so many polygons, so early 3D games wore their facets openly — Sega's Virtua Fighter (1993) and Nintendo and Argonaut's Star Fox (1993) ran on flat-shaded polygon models, and the original PlayStation (1994) made the look a generation's default. Once GPUs made smooth shading cheap, low-poly flipped from limitation to choice: 2010s indie games such as Kentucky Route Zero (2013) and Superhot (2016) used it as deliberate art direction, while a parallel 'poly art' illustration wave — faceted animals, mountain wallpapers, album covers — spread through design communities in the same years.
约束在先:1990 年代的实时 3D 硬件只能推那么多多边形,所以早期 3D 游戏把刻面露在外面 —— 世嘉的《Virtua Fighter》(1993)和任天堂与 Argonaut 的《Star Fox》(1993)都跑在平涂着色的多边形模型上,初代 PlayStation(1994)更让这种样子成为一代人的默认。等 GPU 让平滑着色变得便宜,低多边形就从限制翻转成了选择:2010 年代的独立游戏如《Kentucky Route Zero》(2013)和《Superhot》(2016)把它当作主动的美术方向,与此同时一股并行的「poly art」插画浪潮 —— 刻面动物、山峦壁纸、专辑封面 —— 也在同几年传遍设计社区。