On the Dark side of UI

We had this one frequent request from our clients that we’ve decided to fulfill. It’s not a secret that the dark UI trend that has started in the 2016 and still follows us in the design world.

We are not going to convince you to go to the dark side (are we?) but we have a lot of clients, who prefer dark style in their applications. So, for those who use it or are going to use it, we’ve made the predefined Dark Theme that you can use right now by adding just one line of code.

Before you do it, we want to show the look & feel:

To tell the truth when you switch to the dark UI the first impression is how stylish, modern and cool the component looks. Of course, it all depends on the goal of your product and your end-users’ preferences. Still, by using the dark skin you can add some elegance and prestige to your product.

The white text, gray icons in Toolbar on the black background provide a good contrast that is readable. You can also notice how good the hierarchies are visually highlighted.

All Filters and Field Lists are convenient and intuitive to use.

There is an opinion that dark theme is more preferable for your eyes and concentration, so you can see a lot of well-known tools for developers like CodePen, JSFiddle are also going dark. Besides, for all users who have devices with AMOLED display it is better to use dark interface to reduce battery consumption. What are your thoughts about it?

Talking about contrast we bet the charts look winning with the dark template. It will definitely give your reports a visual appeal.

To start using the dark UI in your project, just download the latest version and include the reference to dark theme in your project:

<link rel="stylesheet" type="text/css" href="/theme/dark/flexmonster.min.css" />

You can also check our demo to compare other themes that are available to use.

And use our detailed tutorial how to customize the appearance of your pivot grid UI.