Next Gen Data Learning – Amplify Your Skills

Blog Home

Blog

Power BI Desktop Icons

by | Power BI

Without a doubt, Power BI desktop icons can take your reports from basic to visually appealing. If we use it the right way, it can provide context and enrich the navigation experience of our report. It will also help declutter our report and add a professional touch to our design.

Power BI desktop icon

To illustrate, look at this KPIs I built inside Power BI.

Let’s take off the icons from the background. Obviously, the difference is very clear. The Power BI desktop icon adds that extra element which makes your KPIs look better.

Where To Find Power BI Desktop Icons

There are many sites where we can find and download icons. The ones that I use most often are thenounproject.com and flaticon.com. These sites have millions of icons for download.

Flaticon.com has more than 6.4 million vector icons and stickers. They also have animated icons, which are also interesting to consider when creating icons and buttons inside Power BI.

Additionally, we have thenounproject.com which has more than 3 million icons and photos. You can find them by category and by theme.

power bi desktop icon

And of course, we have PowerPoint. Let’s see the different ways how we can integrate icons inside Power BI.

Open PowerPoint then go to Insert and select Icons.

As we can see, we have a lot of icons to choose from. We can either use the search field or the categories.

In this example, click the Communication category, choose your desired icon, and click the Insert button.

Now we have the icon in PowerPoint. The next thing to do is to save the icon and integrate it inside Power BI.

Right-click on the icon, select Save as Picture, change the format to PNG, and then click the Save button.

power bi desktop icon

Integration Of Power BI Desktop Icon

Let’s jump over to the Power BI desktop. There are different ways to integrate the Power BI desktop icon.

The first option I will show you is useful if you want to add a visual element to your page. Go to Insert, click Image.

power bi desktop icon

Choose the icon and then select the Open button.

power bi desktop icon

We now have the icon integrated inside Power BI. We can change its size to make it look better on the report page.

power bi desktop icon

Another way we can integrate icons inside Power BI is through buttons. Go to Buttons, select Blank, and then drag the box next to the first example.

power bi desktop icon

After that, go to Background and Shape to toggle off the background and border.

power bi desktop icon
power bi desktop icon

Then, under Style go to Icon. Notice that there are different types of icons inside Power BI such as the Left arrow, Right arrow, Back, Reset, and more.

For this example, let’s select Custom to have a browse selection. Click the Browse button, select the icon that we saved, and from the Image Fit option, select Fit.

power bi desktop icon
power bi desktop icon

Finally, we now have the icon integrated inside Power BI through a button.

power bi desktop icon

Advantages Of Integrating Icons Through Buttons In Power BI

Evidently, it is easier to insert an icon by going to Insert then Image. However, there are advantages when doing it through a button.

The first advantage is that we can hover over effects by going to the Button section. Under Style, go to Fill then select blue fill.

power bi desktop icon

On the Default State, let’s set transparency to 100% while on the Hover State, let’s reduce the transparency to 50%.

power bi desktop icon

Also, it is important to note that we can rearrange this button to look better by going to Hover State and then Padding to add some extra space on the top, bottom, left, and right.

power bi desktop icon

Another advantage is that if you want to add a button and perform a specific action, you can simply go to Action and then select Bookmark type to go to page navigation.

power bi desktop icon

As a result, it’s pretty obvious that this is the button we want to achieve.

power bi desktop icon

Another interesting fact is that since the end of 2021, we can also add text inside the button. 

Similar to the steps that we did earlier, we have to go to Buttons, select Blank, and drag the new box next to the two examples. Then, go to Background and Shape to toggle off the background and border.

power bi desktop icon

Then again, under Style go to Icon, choose Custom then select the icon and set it to Image Fit.

This time around, let’s activate the Text and write the word Victory. After that, change the color and arrange the size of the icon to make it smaller. 

power bi desktop icon

So there, we now have the smaller button with integrated text for the context of the icon and name.

power bi desktop icon

***** Related Links *****
Power BI Custom Icons | PBI Visualization Technique
Power BI Report Development: Creating Themes, Company Logos, Icons and Backgrounds
How To Add Custom Power BI Icons Into Your Reports

Conclusion

In summary, here are some of the best practices in iconography which we can implement: simple icons are the best, do not get too creative with your icons, and keep your styles consistent and cohesive.

In addition, if you have a specific color theme for your report, make sure the color of your icons are matching the theme. Let’s also be aware of the types of icons because some icons are filled while others only have an outline. The type of icons should match so if you use unfilled icons, the line should match as well.

The icon style should be simple and easy to understand. They are meant to enhance comprehension and never distract. It is recommended to reduce icon graphic details as it will be easier for users to consume your report on smaller screens.

All the best,

Alex

Related Posts