Invite us into your inbox! We promise we won't overstay our welcome - we'll pop up once a month with updates on industry trends, best practices & new strategies. 

Applying Dark Mode to Our Own Brand

It’s always easiest to experiment on yourself, which is why we made a push to include an automatic dark mode on the new Blend Interactive site.

Client

  • Blend Interactive

Start your web project.

Design for clarity. Design for simplicity. Design is deeply rooted in providing easier access to function and information — and, nowadays, that means meeting the user where they are. For some, that “where” is more of a “what”: in order to ease eye strain (and add a certain level of coolness) more and more websites and apps are adding a dark mode feature.

What better way to try things out than to experiment with ourselves?

The new Blend Interactive site was designed with two main goals: to clearly document why Blend is the best team in the industry, through articles, podcasts, and other thought leadership, and to provide a testing ground for new design methods. To that last point, Blend focused on implementing dark mode.

Blend's home page in both dark mode and light mode.

On one hand, dark mode is a front-end exercise. Instead of creating one standard style that works across the site, our design and front-end team was tasked with creating a second one. As we explained in an article about dark mode, the process means more than just changing the background color. Fonts, icons, and colors were all duplicated to work and correspond to both potential backgrounds. And, it’s as easy as flipping the switch: you can choose your theme based on your computer’s settings, or manually flip from light to dark.

Careers icons in both dark- and light-mode styles.

On the other hand, creating content for dark mode is an editorial practice. Images must work well on both backgrounds — or, in some cases, a separate image must be created to correspond. We built these fields into the site to allow for flexibility (when necessary).

In the end, what we’ve done is back up our ongoing dedication to experimentation: we tested something on ourselves, creating a great opportunity for future clients. You could say that, when it comes to dark mode, we won’t be left in the dark.

Related work.

View design and strategy projects similar to this one.

A Fresh Look for a Minnesota Institution

Updating the design for Minnesota State University Mankato in a way that didn’t remake the entire website.

Creating a New Product: From User Flows to Prototypes

User flows helped us determine the best way to move users from one point to another, and prototypes helped confirm we were going in the right direction.