Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Register now to learn Fabric in free live sessions led by the best Microsoft experts. From Apr 16 to May 9, in English and Spanish.

Reply
joshberry
New Member

Fonts in custom visuals

I'd like to use the same font being used for the callout value on the gauge chart. In the browser inspector, it's reported as being 'wf_standard-font_light'. I've tried simply setting that font in visual.less, but that font family doesn't appear to be available from my custom visual's iframe. 

 

What is the best way to make this font available for use in my custom visual? Is there a common style sheet I should be referencing?

5 REPLIES 5
Anonymous
Not applicable

I've been looking into this and discovered a way to use custom font files in custom visuals.

 

So for your need of the "wf_standard-font_light" font, you would get the font using developer tools on some browser (I used firefox):

 

guage.PNG

firefox.PNG

 

and download the woff file listed (you can also use the css associated for your css), then you will take that file and encode it to base64 using a site like this. And create a css font-face rule in your .less file, but replacing the src url with this:

 

src: url("<output of base64 encoder>") format("woff");

 

Then you will be able to use the font-face and it should work correctly. I know this is a dirty method, but it's the only way I could work around the sandbox and not letting you include woff (etc.) files in the build process.

v-viig
Community Champion
Community Champion

We wouldn't recommend such method since this font is private and we don't have any plans to share it.
Our recommendation is to use free fonts instead.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Anonymous
Not applicable

I would certainly take into account licensing before implementing this outside of a purely informational exercise. I should have made that clear in my previous post. What is Microsoft's stance on using a font built into Power BI with a custom visual displayed only in Power BI? Why do custom visuals not have access to the styling that built-in visuals have in the first place?
v-viig
Community Champion
Community Champion

Initially fonts were turned off to reduce the payload for iframe that is used for isolation of custom visuals.

There're also some licensing issues that prevents us from allowing the fonts for external custom visuals.

 

We'd recommend that you should use free fonts instead.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

v-viig
Community Champion
Community Champion

Hello @joshberry,

 

Thanks for your feedback.

The wf_standard-font_light isn't available for custom visuals now. There's no way use this font with custom visuals at least now.

 

However, you are able to use other public fonts.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Helpful resources

Announcements
Microsoft Fabric Learn Together

Microsoft Fabric Learn Together

Covering the world! 9:00-10:30 AM Sydney, 4:00-5:30 PM CET (Paris/Berlin), 7:00-8:30 PM Mexico City

PBI_APRIL_CAROUSEL1

Power BI Monthly Update - April 2024

Check out the April 2024 Power BI update to learn about new features.

April Fabric Community Update

Fabric Community Update - April 2024

Find out what's new and trending in the Fabric Community.

Top Solution Authors