Hacker News Reader

Comment by Meekro | Hacker News Reader

I'd love to see a built-in dark mode! I develop a SaaS-type control panel and many of my users spend hours a day interacting with it. Requests for a dark mode have been increasing over the last year, but restyling every built-in Bootstrap component feels clumsy.

View on HN

The beauty of Bootstrap is that it's easily tweakable with SCSS variables. If you do, make sure you use Bootstrap's color-yiq() function so you'll always have the same color/text contrast, in dark and in light mode.

Read more about Bootstrap's color-yiq() here: https://getbootstrap.com/docs/4.5/getting-started/theming/#c...

Do you use CSS or a preprocessor like SCSS? In the later it is mostly a matter of changing a few variables.

You can create a dark mode by changing a few variables, and all of the Bootstrap components will still look right? Can you show me how?

Yes.

https://bootswatch.com/darkly/

It's just a matter of setting some Sass variables.

https://getbootstrap.com/docs/4.1/getting-started/theming/

Unsure how we'll tackle this overall, but we are looking at increased customization and variants for a handful of key components. This might be a mistake, and if so, we'll hope to hear it in the alphas so we can shift gears and do dark mode across the framework. That said, it could be too far reaching and mean it'd come in v6.

Can your users install extensions? Dark Reader[1] works well enough that I don't care if websites offer dark mode, they are dark for me.

[1]: https://darkreader.org/

CSS custom properties would be a step in that direction. Although native dark mode support would be nice.

Reply on news.ycombinator.com