连接设计师与开发者

由抖音前端与 UED 团队维护,易于定制的现代化设计系统,帮助设计师与开发者打造高质量产品。

semi web arch
semi application demosemi application demo

现已服务 10 万 + 用户

Bytedance SSO

完善的开发者体验

开箱即用的底层能力支持,为开发者节省精力,避免重造

易于贡献的 FA 架构

Semi 基于 FA 架构设计,主逻辑抽为 Foundation 包,易于迁移到其他框架

完备的无障碍支持

Semi 遵循 W3C 标准为所有组件提供键盘交互、焦点管理和语义化

国际化与多语言

Semi 提供完备的多语言、多时区、RTL支持,轻松打造全球化应用

Live Code 组件

LiveCode 允许你使用在线代码编辑器即时演示你的 UI 组件

稳定的质量保障

Semi 使用了单元测试等多种方法保证组件的稳定和质量,代码覆盖率达到 90%

支持 SSR

Semi 组件库支持 SSR 场景,可以在 Next.js 和 Gatsby 等框架中使用

百变主题

快速克隆或深度定制,灵活调配符合品牌调性的设计风格

Semi Design 默认

飞书 Universe Design 主题

抖音创作服务主题

剪映主题

火山引擎主题

Richard Hendricks

@RichardHendricks
中国 北京官方认证richard@gmail.com首席吃货,擅长算法,特别是
视频压缩算法
官方话题大 V

私信管理

Apple 账号richard@icloud.com
Google 账号richard@gmail.com
Instagramrichard_aaa
FacebookRichard Hendricks
发信人私信内容发信时间
系统通知#Semi Design2Code# 技术分享开讲啦!根据活动规则,恭喜 13 位...2020-02-02 05:13
系统通知Semi Design 分享演示文稿2020-01-17 05:31
系统通知设计2020-01-26 11:01

Semi 设计系统管理

强大的主题编辑器,实时生效,设计工具一键同步

让设计与代码同源

BETA

使用真实组件设计,前端代码一键转

上传报告

文档中文名

*

文档英文名

文档链接

*

报告标签

结论

备注

连续上传

打造现代 Web 应用

使用 Semi 与现代操作系统、浏览器更贴近的设计语言

内容深度解读

了解我们在无障碍、主题定制、自动化方案背后的思考

Semi Design 中的无障碍设计

「不支持 Accessibility 的前端开源 UI 组件库,就是灾难」

深入浅出 Semi 主题化方案

兼容多元的品牌语言和产品形态,避免无意义的重造

与用户共同成长

Semi Design 重视我们的用户,加入并助力我们不断完善

Stars

0+

Fork

0+

下载

0+

贡献者

0+

特别鸣谢

semi application demosemi application demosemi application demosemi application demo

@Mengzhou

前端, 字节跳动

C

@Changyi

前端, 字节跳动

M

@Miaomiao

设计, 字节跳动

Y

@Yinfeng

产品经理, 字节跳动

@Dingwei

前端, 字节跳动

@Jingyu

前端, 字节跳动

@Yucang

前端, 字节跳动

G

@Guangye

产品经理, 字节跳动

@Baifu

前端, 字节跳动

连接设计师与开发者

今天起,在下一个项目中使用 Semi Design

我是开发者

基于设计语言开发,能够在线调试的 React UI 组件库, 帮助开发者高效构建应用

组件文档

我是设计师

基于 Figma 构建,与组件库代码完全对齐的设计资源,使用 Semi 设计出色的中后台企业应用

Figma UIKit