One of the problems with adding “Dark Mode” to your website are those glaring white boxes. You know it when you see it, those pieces of content that simply weren’t designed for low-light conditions. While text and pictures can easily be adjusted, what about interactive content? That’s a little more complex, which is why “Dark Mode” is the topic of this week’s free Tumult Hype template.
I realize the problem when I restored the “dark” CSS settings on this website. Dark mode looks great, but the imperfections can really stand out. The “Timing” template is an excellent example. In dark mode, the white box beams likes a flashlight in the night. So, I fixed it…
See the “Dark Mode” chapter in A Book About Hype for more details. You can also download the Dark Mode Template to see how it works.
One of the biggest challenges of working on the new edition of the Hype book is Dark Mode. It’s not about technical difficulty. Rather, it’s about how I miss it. Since A Book About Hype is to be printed — in black and white — I’ve been trying to keep the pictures light. That means running the Hype app in “Light” mode instead of “Dark” mode. Too much black ink in one spot can lead to smudging. I’m looking forward to putting my Mac back into Dark Mode as soon as this project is done. That’s why I think this week’s template is important. Dark Mode can improve readability. People appreciate fine design. Fortunately, it’s not too difficult to add “Dark Mode” support to a Hype project.