What color should I choose for my UI background?

Dark or light?

I say, “Lighten up, dude! But stay active.”
I know this sounds like life advice, but this works great with UI.

There are hundreds of color theory advice that you need to keep in mind while choosing the UI theme. But two things stay put:

• Lighten up the background.
• Keep the focus on action items.

Let’s forget about UI and go back to our regular garden example. The user wants flowers, and a place to sit and enjoy his garden. How would you design it?

• All flowers with a bench in between them.
• All flowers but with some space to walk in till the bench.
• Flowers on side, and grass in middle, with a bench.

Of course, the design will depend on user preferences, but if you have to design it for a larger user base. Like a public park. Will you fill it all up with flowers?

For a public space, you need to keep in mind the both, usability and ambiance of the park.

Same with our application’s UX.

I believe in draw like a child.

When I say lighten up, I do not mean all the way to white. Stay somewhere towards light grey (or light version of theme color). The problem with white background is that it gives too much contrast, which can cause headache, literally, on longer use. (Explained more on my previous article)

Compare these:

Which one are you ready to stare at continuously for 4 hours?

Here we are not talking about color combos. We will deep dive into that topic later.

Moving on to staying active.

Figure out what is the action item your app needs: Highlight it. As simple as that.

But this doesn’t mean we can highlight everything. Accent only the action time that is really important.

Let’s look at GMAIL app:

There is a reason for every color chosen. You can read more about color theory here.

But do you know what is the best thing about this article?
It still makes sense if I replace ‘Light background’ with ‘Dark background’. Because there is only one thing that matters:
The Accent to required objects.

Overall, de-clutter your app and accent only those items which are necessary.

If you liked this article, please give a ‘❤’ to it, so that I know that you do!
Feedback is welcome and appreciated, please write up your thoughts in comments.