Power BI Icons: Image Visual, Buttons and DAX SVG Measures (2026)

Static and decorative (a dollar sign beside the revenue card, a logo in the header): put it in the page background image or insert it as an image. It never changes and doesn't need to be read by screen readers.

Interactive (navigation, reset filters, info buttons): use a button, or an image with an action. Buttons get hover and pressed states, a tooltip and keyboard focus.

Data-driven (a status dot per row, a trend arrow that flips with the numbers, a flag per country): use a DAX measure or column that returns an image URL or SVG, shown in a table, matrix, slicer or multi-row card.

Mixing them is normal. A typical KPI card has a decorative icon in the background, the value in a card visual, and a data-driven arrow next to it.

In Power BI Desktop, Insert > Image lets you place an image file on the canvas. Size it in Format image > General > Properties so it lands exactly on your grid. Images support actions too: Learn notes that page navigation is supported for shapes and images, not only buttons, so an image can act as a link.

For icons that never move, the page background is often better. Every inserted image is an object in the Selection pane, in the tab order and in the way when you drag visuals around. A background image holds any number of icons as a single layer. Mark any inserted image that is purely decorative as hidden in the tab order so screen readers skip it, as Microsoft's accessibility checklist recommends.

Export icons at twice their display size if you use PNG. A 24 px icon looks soft as a 24 × 24 PNG once the page is scaled up in Fit to page view; export it at 48 × 48.

Buttons are the right choice for navigation and actions. Insert > Buttons offers built-in types (arrows, Back, Information, Bookmark, Q&A and others) and a Blank button you style yourself.

Power BI buttons have formatting states: Default, On hover, On press and Disabled, plus Loading for data-function actions. In the Format button pane, pick the state under Apply settings to, then change Shape and Style for that state. The built-in icons can change per state, for example a right arrow that darkens on hover.

For custom icons, use fill images. Under Style, turn Fill on and browse for an image for each state. A common pattern is three PNGs of the same icon: neutral grey for Default, brand colour for On hover, a darker shade for On press. Set the action (Page navigation, Bookmark, Drill through, Web URL, Apply all slicers or Clear all slicers) under Action, and test it in Desktop with Ctrl+click.

Give every icon-only button a tooltip and alt text so keyboard and screen-reader users know what it does.

Tables, matrices, slicers and multi-row cards can show images from a field whose data category is Image URL. Learn documents this for columns of URLs; the same data category can be set on a measure, and the URL can be an inline SVG data URI. That's what makes data-driven icons possible: the measure builds the SVG text from the current row's numbers.

The steps:

1. Create a measure that returns a string starting with data:image/svg+xml;utf8, followed by the SVG markup.
2. Select the measure, and on the Measure tools ribbon set Data category to Image URL.
3. Add it to a table or matrix. Set the size under Format > Visual > Image size (height and width).

Three details decide whether it works. Encode the hash in colours as %23, because a raw # ends the URL and the icon disappears; writing colours as %23B91C1C avoids that. Use single quotes inside the SVG so you don't have to escape DAX double quotes. And always include a viewBox so the icon scales to the image size you set.

The example draws a filled triangle pointing up in green when the variance is positive, down in red when negative, and a grey dash otherwise.

Icon sets such as Lucide (the ISC-licensed set the VizForge icon library uses) are drawn on a 24 × 24 grid with strokes instead of fills. They convert to DAX directly: copy the icon's path elements into the measure and set stroke, stroke-width, stroke-linecap and fill on the svg element.

The pattern below shows a check-circle icon whose colour comes from a status measure. Notice the colour is concatenated in, with the # already encoded. You can return theme colour names for Field value conditional formatting, but inside an SVG string you need a literal colour, so keep a small mapping measure.

Watch the length. DAX strings are fine at a few hundred characters, but a complex icon repeated across thousands of rows makes the visual heavier. Keep data-driven icons simple (dots, arrows, checks, flags) and leave detailed illustrations to static images.

The VizForge icon library generates this snippet for every icon: choose an icon and colour, copy the DAX, paste it as a new measure.

If you'd rather store icons as files, a column of image URLs works the same way: set the column's data category to Image URL. Learn lists the supported formats as BMP, JPG, JPEG, GIF, PNG and SVG.

The images must be anonymously accessible, with two exceptions: OneDrive for home embed links and OneLake file links (Power BI signs in on the viewer's behalf for OneLake). Images behind SharePoint or OneDrive for work or school sign-in won't load. The mobile apps only show anonymously accessible images or OneLake links.

Inline SVG measures avoid all of that: nothing is hosted, nothing can break when a file moves, and the icon follows the data.

Use one icon style throughout. Mixing filled and outlined icons, or two stroke weights, looks accidental. Pick a set and stick to it.

Size on a grid. 16 px icons in tables, 20-24 px beside card labels, 32-48 px only for navigation tiles. Keep the icon's optical weight close to the text next to it.

Don't let colour carry the whole message. A red down-arrow and a green up-arrow differ in shape as well as colour, which is what Microsoft's accessibility guidance asks for: supplement colour with shape or text. A red dot vs a green dot does not.

Keep contrast. Icons that convey meaning need to stand out from their background; muted icons are fine only when they're decorative.

Label meaning, not appearance. Alt text should say "Revenue above last year", not "green arrow".

The VizForge icon library has 140+ report-focused icons (finance, people, operations, status, navigation) under the ISC licence. Search, pick a colour, then download SVG or PNG, or copy the ready-made DAX SVG measure. In the Design Studio you can drop the same icons onto KPI panels so they're exported as part of the page background, which keeps the report's Selection pane clean.