Ant Design 是什么风格？
Ant Design 选择了确定而不是好看：浅灰底、白卡片、深蓝壳，唯一的蓝留给主操作，为每天泡在表格和表单里的人而造。
Ant Design 速览
Ant Design 是蚂蚁金服 2015 年在杭州开源的企业级设计语言。它最初是支付宝商家侧中后台系统的底座，后来成了国内使用最广的后台界面体系之一。打开国内几乎任何一个管理后台，十有八九一眼就能认出它。
它面向的不是随手逛逛的访客，而是每天一整个工作日都泡在表格、筛选和审批单里的人，所以更看重密度、可预期和扫读速度，而不是视觉上的愉悦。浅灰的底色托着白色面板，深蓝的侧栏和顶栏框出工作区，同一种蓝既用于主操作，也用于选中的菜单项。
整套系统刻意保持安静。文字紧凑，控件高度统一，标签的对齐和标点每次都一样，必填项带一颗小红星。表格自带排序、筛选、勾选和分页。它的目标是：一张密密麻麻的中文表单，或者一张二十列的表格，仍然能舒舒服服地装进一屏。
Ant Design 从何而来？
Ant Design 诞生于一家超大型金融科技公司的实际需要。蚂蚁金服在杭州有几十个内部和商家侧的工具，需要让它们看上去像同一个产品。公司没有让每个团队各自发挥，而是把组件、布局和行为的共同语言写下来，并在 2015 年开源。1.0 版在 2016 年发布。
有三位工程师与它早期的成长密切相关：玉伯、偏右（afc163）和 zombieJ。他们的工作把一套内部约定变成了其他公司也能采用的公共库，围绕它的社区则不断扩充组件集和周边工具。
这种风格属于更大的企业级设计系统传统，但它同时定义了一个带有地域色彩的类型，通常称为“中后台”风格。在这个类型里，用户是受过训练的操作员，屏幕是工作场所，设计好坏看的是它给重复性工作增加了多少摩擦。Ant Design 给了这个类型一副容易辨认的面孔和一套可复用的代码。
它目前的视觉形态基于 2022 年起使用的 v5 设计令牌体系。令牌把颜色、间距、圆角和字体的决定变成有名字、可换主题的数值，团队可以整体采用后再调整，而不破坏一致性。这一转变让 Ant Design 更贴近更广泛的设计令牌潮流，而视觉态度一如既往：克制、紧凑、可靠。
Ant Design 的视觉特征是什么？
灰底白卡
浅灰的页面底色托着白色的内容面板。仅凭色调的差别就足以区分区域，不需要边框或厚重阴影，密集的屏幕也不会显得被框死。面板把筛选栏、表格或表单分别圈出来，让每项任务都有清楚的领地。
深蓝侧栏与顶栏
深蓝的侧栏和顶栏构成应用的外壳。它们锚定导航，给每个页面同一个框架，用户在模块之间切换时不会迷路。与浅色工作区的对比，也让注意力落在内容上。
一种蓝，只给主操作
同一种饱和的蓝用于主按钮和选中的导航项。因为不会被浪费在装饰上，它一出现就告诉用户这页期待他做什么。次要操作保持中性，破坏性操作则使用单独的警示色。
紧凑的文字与统一的控件
正文偏小而紧凑，输入框、下拉框和按钮共用同一个标准高度。这种统一让表单能排成整齐的行，也让表格能容纳很多列。它用宽松的舒适感换来了一次看到更多内容的能力。
表单惯例
标签位于字段左侧，后面带冒号。必填项带一颗小红星。校验提示直接出现在字段下方。这些反复使用的规则意味着，在系统里填过一张表单的人，换任何一张都不必重新学习。
自带行为的表格
表格是整套系统的心脏。列排序、筛选、行勾选、可展开行和分页都是标配，视觉处理则很朴素：细分隔线、淡淡的行悬停效果、对齐的数字。表格是为了读几个小时设计的，而不是为了被欣赏几秒钟。
克制的动效与状态
悬停、聚焦、禁用和加载状态都有明确定义，过渡简短而实用。动效是为了确认“某件事发生了”，而不是娱乐用户。骨架屏和加载圈表明数据在路上，慢请求不会被看成页面坏了。
谁塑造了 Ant Design？
与蚂蚁金服 Ant Design 早期成长密切相关的工程师之一。他的参与是这个项目能从内部约定成长为拥有大量公众追随者的开源体系的原因之一。
自项目早期就与之相关的核心维护者。正是这类维护者持续的投入，使 Ant Design 的文档、组件和发布足够可靠，让各家公司敢于在其上构建。
另一位与项目开发密切相关的工程师。他的工作帮助组件库从首次公开发布一路走到后来基于令牌的 v5 体系。
今天怎么用 Ant Design？
做演示文稿时，Ant Design 最适合内部产品评审、运营汇报，以及任何想看起来像真实后台界面的场合。封面可以是浅灰页面上的一张白色面板，配一条深蓝色带和一处蓝色点缀。内容页要复刻产品的逻辑：上方一行筛选，下方一张表格，一个蓝色操作。数据页可以用数字对齐的朴素表格代替装饰性图表，让整份演示显得可信、有真实工作的气息。
在网页上，它是管理后台、管理系统、CRM 与 ERP 工具、审批流程，以及用户一整天重复同样任务的任何界面的天然选择。保留深蓝外壳，用面板分隔区域，把唯一的蓝放在主按钮上，让表格承担主要分量。定价页和公开的营销页就不太合适，因为这套风格优化的是效率而不是说服。
在内容与营销方面，这种风格可以支撑企业软件的案例研究、文档和产品导览。忠实呈现的界面截图，对将来要使用类似系统的买家显得可信。不要把它硬拉到以品牌为主导的活动页，在那种页面里情绪比清晰更重要。
排版要保持紧凑一致。用一款能同时处理拉丁字母和中文字符的界面无衬线体，字号种类很少，标题与正文的字重差别清楚。表格里的数字要对齐，这样各列可以靠眼睛直接比较。
常见的错误是用大圆角、柔和渐变和宽松间距去“软化”这套系统，这等于否定了它存在的意义——密度。另一个错误是把蓝色用在装饰上，主操作就不再突出。第三个错误是混入消费级应用的惯例，比如浮动标签和隐藏的控件，这会破坏让系统用起来很快的、可预期的表单规则。
Ant Design · 常见问题
Ant Design 风格是什么？
它是蚂蚁金服 2015 年开源的企业级设计语言，以浅灰底、白色面板、深蓝侧栏与顶栏，以及只留给主操作的一种蓝为核心。它优先考虑信息密度、可预期的表单和功能丰富的表格，也决定了大量国内中后台软件的外观。
为什么它看上去比消费级应用密得多？
它的用户要对着界面工作好几个小时，需要同时看到很多字段和行。紧凑的文字和统一的控件高度，让表单或表格不用滚动就能展示更多内容。这种密度是对重复使用者需求的有意回应，而不是不够精致。
什么是“中后台”风格？
它指的是用来在幕后运营业务的一类界面：管理控制台、审核队列、数据维护工具和内部看板。这里的设计优先级是效率与一致性，而 Ant Design 成了国内最知名的视觉与技术参照。
v5 的设计令牌带来了什么变化？
v5 把颜色、间距、圆角和字体的选择表达为可换主题的命名令牌。团队可以整体采用，再调整少数几个值来贴合自己的品牌，同时保持一致。外观依然克制而紧凑，改进的是定制起来有多容易。
能用在对外的营销网站上吗？
不太合适。这套风格为做重复性工作的操作员调校，缺少说服所需的表现力强的排版与宽裕空间。用在产品界面和文档上，品牌页则选更有表现力的风格。
