search

tt-up / fed-in-depth

经验、知识、笔记——让坚持学习成为一种习惯
6 stars 1 forks source link

检测浏览器（系统）是否处于深色（dark）模式 #25

Open yuqingc opened 3 years ago

yuqingc commented 3 years ago

检测颜色模式

if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
    // dark mode
}

监听颜色模式的改变

window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
    const newColorScheme = e.matches ? "dark" : "light";
});

参考关于 @media 的相关文档