Some weeks ago we published about the new Dark widget theme we added. It is being used by thousands of users already. Today we released a new (mini)feature that makes embedding content in dark themed widgets more attractive. Not all embeddable content supports a dark theme and we found a way to ‘solve’ that.

Embedded content with a light theme

We actually use the embed widget quite a lot. It is ideal to pull in information from external sources, such as server statistics or weather forecasts. However, most of these external snippets don’t support themes: usually, it is just black text on a white background. That does not look very pretty when you use a dark theme:

Screenshot from my dashboard, with a very ugly white chart sitting on my otherwise dark themed page

The screenshot above is from my own dashboard page. There are a lot of charts on them and most of them work really well with the dark theme. However, the embedded charts by New Relic stand out in a bad way. The white background does not integrate with the rest at all. Sadly, there is no option to change the theme of the chart. So, what to do? For consistency, I used to change the background of this widget to white as well. That looked a little better. But now, there is a proper solution!

Inverted colors

We added a new toggle to the Advanced settings of the Embed widget: Invert colors. Switch this toggle on, and the content you embedded will be inverted. In other words, all colors will be replaced with their exact opposite colors. So white will become black and black will be white.

New option: invert colors of embedded content

I just switched this new option on, and my New Relic chart suddenly does not stand out anymore. Notice how the white background turned black. It blends in perfectly! One thing you might find strange: the chart line previously was greenish blue and now it is red. That is not an error, that is actually what happens when you invert the colors. It is very similar to what the negative of a photo looks like in relation to the actual image. Most of the time, this is not a problem at all.

Inverting the colors of the embedded New Relic chart makes it blend in with the Dark theme perfectly

Hopefully, you will like this little new feature. It will certainly help building (even more) beautiful dark themed dashboards. And while you’re at it, you might want to check out our Chart widget. It’s been around for quite a while and is really great when you want to plot data from an online data source or spreadsheet. And of course, it supports dark themes!