跳到主要内容
项目详情

Ant Design 是一个面向网站与应用构建的设计系统,官网将其定位为 AI 友好的「设计系统」,并围绕设计语言、组件库和配套生态提供完整内容。它不仅提供大量可直接选用的界面组件,也提供设计价值观、设计指引、样式算法与语义化结构,帮助开发者和设计者在统一的设计体系中搭建产品。组件库覆盖 Ant Design of React、Angular、Vue,并延伸到移动端 UI 组件库 Ant Design Mobile、数据可视化方案 AntV 以及面向 Sketch 的 Kitchen 工具集。

核心功能

丰富的界面组件

官网展示了 DatePicker、Tour、FloatButton、Splitter、Masonry 等组件。DatePicker 用于日期选择,并展示了按昨天、上周、上月、去年筛选的更新选项;Tour 用于漫游导览,帮助用户快速了解新加功能。FloatButton、Splitter 和 Masonry 则分别以新增或组件示例的形式出现在组件展示区域中,覆盖不同的界面构建需求。

多框架组件库

Ant Design 的组件库页面明确列出 Ant Design of React、Angular、Vue,说明组件库配套多个前端研发框架。开发者可以根据项目使用的框架选择对应的组件体系,用于搭建网站和应用。官网还将 Ant Design Mobile 单独列为移动端 UI 组件库,形成 Web 与移动端的配套生态。

主题定制与样式算法

官网提供“定制主题”方向,强调开放样式算法与语义化结构,并展示了多种视觉风格,包括暗黑、插画、玻璃、极客、卡通和知识协作等。主题编辑区域包含颜色值、图标、下拉菜单、按钮状态以及成功、错误、默认、处理中、警告等状态示例,用于体现界面主题和组件状态的组合方式。

设计语言与设计指引

配套内容包含设计价值观、设计指引和组件库。设计价值观列出确定性、意义感、生长性、自然;设计指引覆盖全局样式和设计模式。这些内容与组件库共同构成从设计原则、视觉规范到研发实现的配套体系,用于帮助团队快速搭建网站应用。

面向智能应用的研发支持

官网将 Ant Design 描述为 AI 友好的设计系统,并在首页新闻区域展示了 Ant Design Pro V6 与 Ant Design 6.0 的发布信息。Ant Design Pro V6 的介绍提到 React 19、antd 6、utoo、AI 助手以及构建速度提升 42%;Ant Design CLI 的介绍则提到可以在终端查 API、做迁移,并提供官方 MCP 服务和离线使用方式。

配套生态工具

AntV 被介绍为“全新一代数据可视化解决方案”,Kitchen 被介绍为面向设计者的 Sketch 工具集,Ant Design Mobile 则提供移动端 UI 组件。官网把这些项目放在设计语言与研发框架的配套生态中,覆盖组件、移动端界面、数据可视化以及设计工具等相关场景。

使用方式

官网提供“开始使用”入口,并展示了组件概览、设计语言和组件示例。使用者可以通过组件库选择 React、Angular 或 Vue 体系,也可以使用 Ant Design Mobile 构建移动端界面。页面还展示了 Ant Design CLI 的终端使用方式,包括查询 API、迁移、官方 MCP 服务和离线使用。页面中的账户区域展示了注册账号和“7 天免费试用”信息。

适用人群与场景

前端开发者可以使用 React、Angular 或 Vue 组件库搭建网站和应用;移动端开发者可以使用 Ant Design Mobile 构建移动端 UI;设计师可以参考设计价值观、全局样式、设计模式,并使用 Kitchen 这一 Sketch 工具集;需要数据展示的产品和研发团队可以使用 AntV 数据可视化方案。需要统一视觉风格的团队还可以利用开放样式算法、语义化结构和主题编辑示例进行主题定制。

定价

官网页面展示了“Start your free 7-day trial. No credit card required.”,即提供 7 天免费试用,且开始试用不需要信用卡。正文未提供其他付费档位或具体价格信息。

多框架组件库提供适用于 React、Angular、Vue 的 Ant Design 组件库,并配套移动端 UI 组件库。
主题定制开放样式算法与语义化结构,支持通过主题编辑示例组合颜色、图标和组件状态。
设计语言提供设计价值观、全局样式、设计模式等设计指引,配套网站应用研发。
丰富组件包含 DatePicker、Tour、FloatButton、Splitter、Masonry 等界面组件。
研发配套生态配套 AntV 数据可视化解决方案、Kitchen Sketch 工具集和 Ant Design CLI。

用户评论 (0)

还没有用户评论

成为第一个分享使用体验的人

查看更多

Ant Design 截图

官网首页截图

写评论

分享你的使用体验,至少 10 个字。评论可以发多条,打分在右侧卡片单独进行。

还需 10 个字 · 0 / 500