Core Code
Core Code Modern Dev Handbook

Basic @font-face

The @font-face rule allows you to load custom fonts.

Preview

Code

<style>
@font-face{
font-family:"MyFont";
src:url("https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxP.ttf");
}

p{
font-family:"MyFont", sans-serif;
}
</style>

<p>Custom font example</p>

More CSS Custom Fonts Examples (8)

example Multiple Font Formats open example example Font Display Swap open example example Font Weight Variation open example example Font Style Variation open example example Font Fallback Stack open example example Local Font Source open example example Google Font Example open example example Custom Font UI Example open example