3 ms·
This is, what `<link rel="alternate stylesheet" href="contrast.css" title="High contrast">`is for. (Using JS, you can switch between default and alternative sty
by masswerk 5y ago
This is, what `<link rel="alternate stylesheet" href="contrast.css" title="High contrast">`is for. (Using JS, you can switch between default and alternative stylesheets by setting their "disabled" attribute accordingly.) This mechanism also allows a user to (pre)select a stylesheet in the browser.
Sadly, Chrome doesn't support this standard (it has been around for a while and is in HTML4, HTML Living Standard, CSSOM). But you can work around this by JS, see above.
(Edit: It's for things like this that you still want a menu bar for your browser.)
- lwhi 5y agoTrue, but I'm wondering how the CSS in JS users would implement this.
- betageek 5y agoCSS-in-JS alone doesn't give you many tools for that kind of stuff, but if you use something that integrates more design system-style theming it's pretty easy - have a look at https://chakra-ui.com/ https://chakra-ui.com/ and click on the moon icon in the top corner for instant dark mode. Implementing various themes for high-contrast etc. would just be a case of changing the theme.