Forum Discussion
Anonymous
6 years agoNot applicable
embed a font in custom visual
I am trying to use Bebas Neue for my custom visual. If a user's machine has Bebas Neue installed, everything looks fine. But if the user doesn't have Bebas Neue font installed, the whole visual wen...
dm-p
6 years agoSuper User
Hi Anonymous,
There's definitely one way to do it, if you don't mind loading from a CDN. Here's an exmaple of loading a font in a custom visual I recently did for fun:
- Here's the @font-face declaration in visual.less
- Here's an example of how I apply the styling in the same file once declared
I'm going to attempt compiling a specific font into a new visual I'm working on but haven't got to it yet to be able to test.
I believe that (if this is possible) then you'll need to ensure that the webpack process includes your font when it builds the visual. I was going to start with this article to see if it could be done, falling back to the CDN approach if not. I'd love to hear how you get on if you give it a try!
Hopefully this may give you something to try either way.
Good luck!
Daniel