Web 代码片段——主题

帮助你在整个项目中管理色彩的技术集锦。

欢迎来到我们不断增加的主题片段集。这些片段旨在帮助你创建自适应色彩体系,这样就可以轻松适应用户对明暗等色彩偏好的设置。

使用 HSL 的色彩方案

https://codepen.io/zhoushengdao/pen/OJrMjqq

该片段展示了如何利用 CSS 自定义属性实现超越浅色和深色的主题。

完整文章 · YouTube 上的视频 · GitHub 上的源代码

明暗 HSL 入门套件

https://codepen.io/zhoushengdao/pen/wvRMraV

本片段展示了如何使用 HSL,通过 CSS 自定义属性创建和谐的明暗主题。

明暗主题切换

https://codepen.io/zhoushengdao/pen/xxmZLNL

该片段展示了如何为网站创建一个开关,允许在浅色和深色主题之间切换,并为以后的访问保存该偏好。

该片段使用了 Open PropsEasing 效果。

完整文章 · YouTube 上的视频 · GitHub 上的源代码

你可能感兴趣的:(Web 代码片段——主题)