Skip to main content

Google Design details the Photos, Calendar, and Android Auto dark themes

Over the past several months, many Google apps have adopted dark themes with the Google app and Gmail likely coming next. Google today detailed how the teams behind Photos, Calendar, and other first-party services designed their dark modes.

Google Photos

At the moment, the Google Photos dark theme is only available on Android Q. The team approached the dark design with a “light touch” as to not detract from the pictures being displayed.

The background is rendered in a dark gray rather than pure black, because that saturation contrasts well against bright pixels to better express colorful photos, and icons appear in desaturated soft grays and blues for stronger legibility. The dark background even creates a slideshow effect that’s ideal for casual viewing—imagine turning the lights off at home to watch home videos or project vacation photos on to the wall.

Google Calendar

Calendar is a particularly colorful app as you can theme events to make them stand out in the agenda view. According to Google, those colors “look dramatically different” against a dark background.

Leveraging Material guidance, Calendar crafted an internal system for adapting a wide range of colors to dark theme, desaturating hues and defining brightness, while still letting users express themselves in any shade of the rainbow. The result is vivid color that feels native to a charcoal gray backdrop.

Google News

The text-heavy nature of articles presents a different problem for Google News:

A dark theme for Google News had to consider pixel-bleed, where small white letters contrast too heavily and blur against a dark background (imagine the inverse of ink-bleed on print newspapers, where black letters smudge on white paper). To cut down on blur, the design team utilized the same deep gray backdrop as Google Photos so that light gray text reads clearly, with minimal “vibration.” Gray surfaces also make it easier to create a gradation between shades, which results in surfaces that look elevated—a key element in any Material Design interface.

Android Auto

Coming this summer, the Android Auto redesign notably introduces a Google-designed dark theme that helps match car interiors. It is also safer to use when driving in both day and night conditions by reducing glare.

To further improve glanceability in dark theme, Android Auto also chose to keep graphics simple. Material guidance calls for using elevated layers of graphics to create an information hierarchy, but Auto uses fewer than most Material apps. This way, the driver doesn’t need to visually sort through as many levels of information, and eyes can stay on the road.

FTC: We use income earning auto affiliate links. More.

You’re reading 9to5Google — experts who break news about Google and its surrounding ecosystem, day after day. Be sure to check out our homepage for all the latest news, and follow 9to5Google on Twitter, Facebook, and LinkedIn to stay in the loop. Don’t know where to start? Check out our exclusive stories, reviews, how-tos, and subscribe to our YouTube channel

Check out 9to5Google on YouTube for more news:

Comments

Author

Avatar for Abner Li Abner Li

Editor-in-chief. Interested in the minutiae of Google and Alphabet. Tips/talk: abner@9to5g.com