English | 简体中文
TDesign is a comprehensive Enterprise Design System, and component libraries have been implemented for versions such as Vue, React, and Wechat MiniProgram. TDesign has advantages when used for building applications with consistent design and cross-platform, multi-tech stack capabilities.
Repositories
The following are the repositories for TDesign：
Repositories for Desktop Components
| Repository | Description | Status |
|---|---|---|
| tdesign-vue | Vue.js UI components lib for TDesign | 1.0 LTS |
| tdesign-vue-next | Vue3.x UI components lib for TDesign | 1.0 LTS |
| tdesign-react | React UI components lib for TDesign | 1.0 LTS |
Repositories for Mobile Components
| Repository | Description | Status |
|---|---|---|
| tdesign-miniprogram | Wechat MiniProgram UI components lib for TDesign | 1.0 LTS |
| tdesign-mobile-vue | Vue3.x Mobile UI components lib for TDesign | 1.0 LTS |
| tdesign-mobile-react | React Mobile UI components lib for TDesign | Alpha |
| tdesign-flutter | Flutter UI components lib for TDesign | Alpha |
Repositories for Shared
| Repository | Description |
|---|---|
| tdesign | TDesign main repository and documentation |
| tdesign-icons | A mono repo for TDesign Icons |
| tdesign-common | TDesign Common Style and Utils |
Repositories for Out-of-box Starter Kits
| Repository | Description |
|---|---|
| tdesign-starter-cli | CLI tool for TDesign Starter kit |
| tdesign-vue-starter | starter-kit for TDesign Vue UI components |
| tdesign-vue-next-starter | starter-kit for TDesign Vue Next UI components |
| tdesign-react-starter | starter-kit for TDesign React UI components |
| tdesign-miniprogram-starter-retail | starter-kit for TDesign Wechat Miniprogram UI components |
Why TDesign
Before 2019, there were many internal design system and component library projects within Tencent, centered around product-focused "decentralized" rapid iterations.
In 2019, Tencent established the Open Source Collaboration Committee. Through internal open-source collaboration, it organized different teams working on similar technology products to collaborate.
TDesign is the collaborative outcome of frontend and design under Tencent's open-source collaboration, with the aim to jointly build a comprehensive and versatile design system and component library.
Development of TDesign.
TDesign was founded with the principles of open-source collaboration from the beginning. The collaboration scheme discussion, component design, and API design, including source code, are fully open within the company, garnering widespread attention from internal developers and designers. TDesign follows an equal, open, and strict policy, regardless of the participants' roles.
Many participants started by trying out the component library in their personal projects, advancing to submit their first Issue, then their first Feature MR, and gradually becoming involved in Code Review and solution-formulating tasks, eventually turning into core contributors. In the past year, TDesign has closed 1k+ issues and conducted 5k+ Code Reviews to maintained a weekly iterative release of new versions.
TDesign currently supports multiple platforms and mainstream front-end UI framework. Desktop versions for Vue2, Vue3, and React, as well as mobile versions for WeChat Mini Programs, have been launched as stable versions. Mobile React and QQ Mini Program versions have been released the Alpha versions for internal testing.
Why Open-source
Through open sourcing, TDesign aims to refine a complete and user-friendly component library and cultivate a rich design ecosystem.
With the help of the community, TDesign aspires to maintain ongoing communication with more product designers and developers, evolving into a more valuable product.
Open-source marks a new beginning for TDesign.
For TDesign's subsequent development plan, please refer to the TDesign upcoming plans.
Features
Comprehensive
- Support Vue 2、Vue 3、React for Desktop Application and Vue 3、Wechat MiniProgram for Mobile Application.
- Provide a wide variety of design resources, including Figma, Adobe XD, Sketch, etc.
- Provide auxiliary design tools, such as Sketch Plugin，and support using in CoDesign、Pixso、即时设计、墨刀 as well.
Consistency
- Maintain a unified design values and visual style, helping products maintain a consistent user experience across different platforms during the design and development process.
- Consistently defined and implemented APIs across various tech stacks provide an advantage when building unified, cross-platform, and cross-tech stack applications.
Usability
- Extract Tencent design experience from various business scenarios and offer universal design guidelines to lower the barriers to entry.
- Support extend the design styles by using Design Token.
- Offer TDesign Starter Kit to help developers get started.
Documentations
Read more in the official website of TDesign.
Design Guidelines
TDesign distills Tencent's years of internal design experience into professional design guidelines, providing universal design solutions.
For more information, refer to the guide section of each component, such as Button.
Design Resources
Contributors
❤️ Thanks for all the TDesign contributors：
Contributing Guide
Any contributions to TDesign are welcome. Please read 《contributing for TDesign》 for more information.
License
The MIT License. Please see the license file for more information.