跳到主要内容
项目详情

TDesign 是腾讯“端服务”联盟产品,面向设计师与开发者,提供从设计资源、设计指南到前端组件库的完整设计开发资源。它覆盖桌面端、移动端和小程序等使用场景,并支持 React、Vue、微信小程序、Flutter、Uniapp 等技术栈。除了可直接用于开发的组件资源,TDesign 还提供 Figma、Sketch 等设计文件、Design Token 和行业组件库,帮助不同团队在统一设计体系下开展产品设计与前端开发。官网同时强调其开放共建属性,项目采用 MIT 许可协议,并由腾讯多个业务团队和社区贡献者持续参与建设。

核心功能

多技术栈组件库

TDesign 提供 React、Vue、微信小程序和 Flutter 等业界主流开发技术栈的版本实现,开发者可以根据项目所使用的框架选择对应资源。官网展示了桌面端的 Vue Stable、Vue Next Stable、React Stable,以及移动端的 Vue Next、React、Uniapp 和 Flutter 等技术栈版本,并提供小程序开发资源。

桌面端与移动端适配

产品将组件资源按桌面端、移动端和小程序等场景组织,提供桌面端和移动端两套风格统一的组件资源。这样既能服务于桌面产品的界面开发,也能覆盖移动端和小程序项目的组件使用需求,官网还将微信小程序列为独立的解决方案场景。

设计工具资源

TDesign 为设计师提供 Figma、Sketch、Axure、Adobe XD 等格式或工具对应的设计资源,且桌面端和移动端均有设计资源入口。官网还提到 Figma 设计资源持续更新,包括组件上新、变体优化和更多图标资源,设计师可以在设计阶段使用与组件体系对应的资源。

Design Token 与设计指南

TDesign 将设计样式抽离为 Design Token,以满足不同产品的品牌定制需求。官网同时提供专业的设计指南,将设计经验提炼为指南,帮助使用者正确使用组件;页面中的示例还展示了仪表盘、列表页、表单页和详情页等常见产品页面类型。

行业组件与 AI 编程辅助

TDesign 由腾讯多个业务团队基于统一设计体系提供多个垂直领域的行业组件库产品,覆盖从消费产品到金融服务等不同类型的产品场景。官网更新信息还显示,TDesign 已上线 MCP 工具,用于辅助 AI 编程场景,并支持桌面端组件库场景使用;TDesign AI Chat 新版本则同步开源组件源码和设计资源。

使用方式

TDesign 可从官网提供的开发资源和设计资源入口开始使用,开发者也可以通过 npm 安装组件库。例如 Vue 版本的示例包括安装 tdesign-vue、引入 Vue、引入 TDesign、导入样式文件并执行 Vue.use(TDesign)。官网还提供 GitHub 项目的“开始使用”入口。正文未提到注册要求、自备模型 Key、导入导出或 API 服务。

适用人群与场景

前端开发者可以根据 React、Vue、微信小程序、Flutter 或 Uniapp 等技术栈选择对应组件资源,用于桌面端、移动端和小程序项目。设计师可以使用 Figma、Sketch、Axure、Adobe XD 等设计资源完成界面设计,并参考设计指南使用组件。需要统一品牌视觉的产品团队可以使用 Design Token 定制设计样式;涉及消费产品、金融服务或其他垂直行业的团队,则可以使用相应的行业组件库。

注意事项

官网正文明确说明 TDesign 采用 MIT 许可协议,并持续开放共建。不同技术栈和终端对应的资源状态并不完全相同,页面将部分资源标注为 Stable、Alpha 或长期维护的 Uniapp 技术栈,使用时需要根据项目场景选择对应版本。

多技术栈版本支持 React、Vue、微信小程序、Flutter 等业界主流开发技术栈。
多端适配提供桌面端和移动端两套风格统一的组件资源,并覆盖小程序场景。
设计资源丰富提供 Figma、Sketch、Axure、Adobe XD 等设计工具对应的资源。
Design Token将设计样式抽离为 Design Token,满足不同产品的品牌定制需求。
行业组件库由腾讯多个业务团队基于统一设计体系提供多个垂直领域的行业组件库产品。

用户评论 (0)

还没有用户评论

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

查看更多

TDesign 截图

官网首页截图

写评论

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

还需 10 个字 · 0 / 500