Documentation and examples for custom fonts: Google AMP Font Awesome Icons Library.
Google AMP pages can’t include external stylesheets, with the exception of custom fonts and icons. You can embed custom fonts into your page in two ways:
<link> tag (white-listed font providers only)@font-face (no restrictions, all fonts allowed)1. Using <link>
Use a <link> tag (usually in the head of your page), like so:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" type="text/css"/>The following origins are whitelisted and allowed for font serving via link tags:
2. Using @font-face
Alternatively, you can use @font-face within your Google AMP stylesheet:
<style amp-custom>
@font-face {
font-family: "FontAwesome";
src: url("https://somedomain.org/fonts/fontawesome-webfont.ttf");
}
body {
font-family: "FontAwesome";
content="";
}
</style>@font-face must be fetched via the HTTP or HTTPS scheme.