使用混合混合模式的夜间模式:差异

Avatar of Robin Rendle
Robin Rendle

DigitalOcean 为您旅程的每个阶段提供云产品。 立即开始使用 200 美元的免费积分!

暗黑模式设计现在非常流行,但这里有一个有趣的观点:Wei Gao 在 她自己的网站 上构建了一个夜间模式,它使用 mix-blend-mode: difference 创建一个看起来像这样的效果

Wei 解释了她是如何实现这种技术的以及她在过程中遇到的边缘情况。 我特别喜欢她在这里对 mix-blend-mode 函数的评价

我记得几年前在 Photoshop 中第一次尝试使用它们。 现在浏览器变得越来越强大,我们看到浏览器渲染中出现了复杂的图形功能。 这并不意味着我们应该在浏览器中实现一个完整的 Photoshop,也不应该将我们的想象力局限于此。 浏览器和网页有自己的上下文和目标,以及不同的限制。 也许我们应该像欢迎新居民一样欢迎它们,并发现适合该领域的用例。

确实! 虽然 Wei 的技术本身非常独特且很棒,但这都与引发整个趋势的事物相关:prefers-color-scheme 媒体功能 它在 Safari 中作为 MacOS 10.4 版本的一部分发布,为我们提供了暗黑模式首选项设置。 这是一个发展中的领域,因此我们肯定会在未来看到更多创新和方法。

直接链接 →