Screenshot of Gmail using Darkness's Monokai theme
An email list in Gmail with Darkness’s Monokai theme

“Darkness” is a web browser extension that allows the user to change the appearance of certain light-colored websites into a dark color scheme. I personally designed a dark “Monokai” Darkness theme for Gmail, Google’s email service.

Development

The client for Darkness specifically requested that I develop this Monokai Gmail theme using the CSS pre-processor SASS (Syntactically Awesome Style Sheets) rather than plain CSS. Some of the benefits of using SASS over plain CSS are that it can use custom variables and it can copy properties of elements of one SASS file into elements of another while still exporting everything into a single CSS file.

The colors of the Monokai Gmail theme were based on a pre-made list of color variables. My responsibility was to apply those color variables into Gmail’s web design. I also added some extra variables that were needed but didn’t exist before.

Screenshot of Gmail with compose email box in Darkness's Monokai theme
An email composition window opened over an empty inbox

Developing this theme for Darkness was a little more challenging than it usually is for developing websites because we didn’t have access to Google’s original development CSS, and the live CSS of Gmail uses meaningless, obfuscated class names for all elements. I had to painstakingly reverse-engineer the CSS by using Chrome Developer Tools to inspect every nook and cranny of the website that needed its color changed.

Client's Testimonial

Damian helped me by building a dynamic SASS-based skinning layer on top of Gmail, in the context of a Chrome extension.

In his work, Damian demonstrated deep technological understanding, high professionalism, attention to details, and great communication skills. The results were beyond my expectations, and were delivered in a timely manner.

Would highly recommend! A+++

— Lior Grossman

About Darkness

Darkness, developed by Lifehack Labs, is an extension for the web browser Google Chrome. In addition to Gmail, Darkness can switch to dark color schemes for certain other websites including Google, Facebook, YouTube, and more. It’s available at the Chrome Web Store, where more than 100,000 people have installed this extension.

What's Next?

If you have your own project that requires a web developer, maybe I can be of service to you.

Similar Projects

To read about other projects where I designed an app’s graphical user interface, see: