Search code examples
cssfont-face

Can I use custom @font-face font with same name as built-in font?

If I have a custom font and I call it 'verdana', will that conflict with the browser's built-in verdana font? When I do:

font-family: 'verdana';

will the browser use my custom font or the built-in one?

Solution

  • Yes, you can use a custom font name that may coincide with the name of an installed font. It might be confusing, though, and might look suspicious (using a font illegally) to use a name like Verdana, if someone peeks at your code.

    The CSS3 Fonts draft says: “If the font family name [in @font-face] 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. This permits a web author to freely choose font-family names without worrying about conflicts with font family names present in a given user's environment.”