TDesign

项目概述

TDesign 是由腾讯开源协同委员会主导推出的官方企业级设计系统。源自腾讯内部数千款业务产品的经验沉淀，TDesign 提供了贯穿 React、Vue 3、Vue 2、Flutter 以及 微信小程序 的多端全栈组件库解决方案。

其设计风格务实稳健，配套体系完善，为中后台及跨端业务提供高度统一的视觉语言与研发效能支撑。

核心特性

• 🐧 腾讯级业务生产打磨：支撑腾讯内部云控制台、中后台系统与海量 C 端业务，稳定性与健壮度极高。
• 🌐 全技术栈全平台覆盖：一套设计规范，同时提供 Web（React/Vue）、移动端（H5/Flutter）及微信小程序的原生组件支持。
• 🎨 精细化 Design Tokens：支持丰富的调色板配置与暗黑模式适配。
• 🛠️ 完善的开箱模板：提供 TDesign Starter 中后台开箱即用模板脚手架。

快速上手与示例代码

npm install tdesign-react

React 基础调用示例

import React from 'react';
import { Button, Space, DatePicker } from 'tdesign-react';
import 'tdesign-react/dist/tdesign.css';

export default function App() {
  return (
    <Space direction="vertical">
      <DatePicker placeholder="选择日期" />
      <Button theme="primary">确认提交</Button>
    </Space>
  );
}

技术选型建议与适用场景

• 非常适合：腾讯生态体系项目、需要同时覆盖 Web 桌面端与微信小程序/移动端的多端协同业务系统。
• 不适用场景：对纯原子化样式有特殊偏好或完全不使用组件库 CSS 包的极简项目。