mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-12 23:35:38 +08:00
fd498a7da5
* docs: Design doc * update overview & init data-format * update data-format doc * update buttons page * replace imags * add data-list doc * add visualization docs * update detail * Update visualization-page.md * Update detail-page.md * Update buttons.md (#20843) * Update data-list.md (#20844) * data list * update details * Update MorePage.tsx (#20965) * Update MorePage.tsx * Update visualization-page.md (#20977) * Update data-list.md (#20980) * Update detail-page.md (#20981) * chore: Update RecommendPage.tsx (#20989) * Update RecommendPage.tsx * Update RecommendPage.tsx * Update buttons.md (#21003) Co-authored-by: yingxirz <inseeing@gmail.com> * Update buttons.md (#21004) Co-authored-by: yingxirz <inseeing@gmail.com> * rm inner link * hide docs tmp * fix typo * adjust doc Co-authored-by: myeunhyuk <39618466+myeunhyuk@users.noreply.github.com> Co-authored-by: linye <59957450+ionshaw@users.noreply.github.com> Co-authored-by: yingxirz <inseeing@gmail.com>
1.4 KiB
1.4 KiB
| category | order | title | skip | ||||
|---|---|---|---|---|---|---|---|
| 全局样式 | 6 |
|
true |
暗黑模式是指把所有 UI 换成黑色或者深色的一个主题模式。
何时使用
- 当需要长时间在暗光环境下工作时，建议使用暗黑模式，减小亮度对比带来的视觉压力，保证使用者的体验舒适
- 当需要沉浸式的专注工作内容时，建议使用暗黑模式，可以帮助使用者更关注凸显出来的内容和操作
如同在电影院看电影时要全场关灯，是一样的原理
设计原则
1、内容的舒适性 暗黑模式下避免使用对比很强的色彩或内容，长时间使用会带来疲劳感
2、信息的一致性 暗黑模式下的信息内容需要和浅色模式保持一致性，不应该打破原有的层级关系而应该延续。在浅色模式下越浅的代表信息的层级越弱，所以在暗色模式下应该越深，反之则越浅
色彩
暗黑模式中的颜色使用依旧可以延续浅色模式中的 12 套基础色板。应用思路上结合透明度规则处理，来让内容在不同的环境色下可以更好融合。
基础色板
TODO: Image
色板生产工具
我们也同样提供了一套暗色下的色板生成工具，需要选择你的主色以及页面的背景色，我们会为你生成一套暗色下的色板
TODO: Panel