I think you may be misunderstanding how @font-face rules and font-family names work. (Or else I'm not understanding how you're stating it.) See https://www.w3.

I think you may be misunderstanding how @font-face rules and font-family names work. (Or else I'm not understanding how you're stating it.) See https://www.w3.org/TR/css-fonts-3/#font-family-desc https://www.w3.org/TR/css-fonts-3/#font-family-desc: > If the font family name is the same as a font family available in a given user's environment, it effectively hides the underlying font for documents that use the stylesheet. Given CSS such as body { font-family: Palatino, serif; } @font-face { font-family: Palatino; src: url(palatino.ttf); } this will block the browser from using an installed Palatino font and tell it to load the remote resource instead. So it's possible to use @font-face { font-family: Palatino; src: local("Palatino"), url(palatino.ttf); } to ask for the locally-installed font if present, falling back to the remote resource otherwise.