0

I'm developing an extension for Google Chrome. I want to use custom fonts in my extension. I have declared a @font-face rule in my stylesheet like this:

@font-face {
    font-family: "Anonymous Pro";
    src: url("../assets/fonts/Anonymous-Pro/Anonymous-Pro-700.ttf");
}

But, this doesn't seem to work. I get an error like this:

GET chrome-extension://klcdnidgljemjhocdlalimcigcfmlbbk/assets/fonts/Anonymous-Pro/Anonymous-Pro-700.ttf net::ERR_FILE_NOT_FOUND

Do I need to set any permissions in my manifest file to use custom fonts? Please help.

1 Answers1

1

It's likely that the font doesn't exist in the set location. Recheck your URL

Here is a much detailed answer on Packaging a font with a Google Chrome extension.

Ashesh
  • 3,499
  • 1
  • 27
  • 44
  • Hey. You're right. The URL was incorrect. But, I don't understand. I have named the folder as 'Anonymous-Pro', but the URL shows it as 'Anonymous-Pro.001'. What am I doing wrong? –  Apr 25 '15 at 13:20
  • follow the link I have added. – Ashesh Apr 25 '15 at 13:23
  • I've already read that link. But, can you explain me why the folder got named 'Anonymous-Pro.001'. In fact, even the Finder on my Mac shows the name as 'Anonymous-Pro'. –  Apr 25 '15 at 13:24
  • I am not very sure how that happened. – Ashesh Apr 25 '15 at 13:32
  • also you must include other formats like eot, woff, svg to make the font work across all platforms. – Ashesh Apr 25 '15 at 13:34
  • 1
    This is an extension for Google Chrome. And Chrome supports TrueType format. So, I'm better off with just 'ttf' :) –  Apr 25 '15 at 13:44