Date 2026-05-11 10:50:08
俗话说：「眼见为实」，但是你的眼睛真的不会欺骗你吗？让我们来看看设计中常见的九种视觉错觉！下次甲方怀疑你的专业能力，给他看一个。
能找到三角形的中心吗？ 并不是所有的图标都是对称的，但实际上很难找到我们常见的播放按钮图标的视觉中心。造成这种情况的原因是由于三角形分裂错觉的影响，中心位于三条中线(顶点与对面中点的连接)的交点，这是重心。
下图仅凭肉眼，你能看出哪个版本是居中的吗？
红色的形状是矩形吗？ 正方形是每个设计的基本结构。在矩形中放置一个正方形实际上在垂直方向上看起来更长，尽管它实际上是一个正方形，这被称为垂直水平错觉。
看得出 Facebook 帖子中的图片是1：1正方形吗？
你能看到相邻初期的阴影吗？ 我们把相同颜色的渐变相邻放在一起。你注意到了什么？边缘是否会发现不存在的阴影？我们称之为这种视觉错觉「马赫带」。事实上，图像中没有添加 阴影，只是我们的眼睛产生了错觉。
「不存在」阴影出现在每行的边缘之间。
两条垂直线看起来也能移动吗？ 你有没有看过类似的网站，背景中有非常细的线条和一些点，当我们滚动时，我们觉得线条和静止的点在跳动。这就是郝林的错觉，两条平行线因斜线而弯曲。还有我们常见的摩尔图案。
滚动你的页面，线条移动了吗？
你注意到那些若隐若现的灰点了吗？ 幽灵般的灰点会在周围方块的交叉处产生，当你试图转向灰点时，它神奇地消失了。这就是赫尔曼格格。
观察交叉点时会出现灰点。
你认为单独的方形颜色是一样的吗？在最近的网页设计中，垂直布局非常流行。如果将两种相同的颜色放置在不同的背景上，则两个对象的颜色看起来与实际情况不同。这种现象被称为同时对比错觉。
两边的文字颜色其实是完全一样的。
两种紫色的颜色相同吗？ 这种错觉很微妙，但很有吸引力。看看上面的动画，你会发现左边的紫色块比右边的紫色块亮，但实际上两者都是一样的。
浅色背景前灰线较暗，黑色背景前较浅。
长方形内部的颜色是白色的吗？ 如果你仔细看，你可能会注意到白色区域产生与边框相同的光投影。这种现象被称为「水彩错觉」。
没有颜色的白色区域，因为边框的颜色带有颜色。
两个对象的颜色是一样的吗？渐变的印象会让你觉得图像的一边实际上比另一边更暗，但事实上，两者都是相同的颜色。
每个菱形都有相同的渐变，但它们看起来越来越暗。
先别说眼睛骗不骗我了。我已经看了好几遍这个动作了！
欢迎关注「优秀的网页设计」公众号：
「如何解决高手的视觉错觉」
“高级学习！视觉设计中的11种经典视觉错觉现象”和“注意细节！如何将视觉错觉应用于UI设计界面？”“睁开眼睛！视觉误差对UI设计的影响和解决方案（附件）