How can I add custom fonts to my website?

How can I add custom fonts to my website?

You can add custom fonts by using @font-face in your CSS or by linking to a font service like Google Fonts.

Can you show me an example of using @font-face?

Sure! Here's a basic example:

@font-face {
    font-family: 'MyCustomFont';
    src: url('MyCustomFont.woff2') format('woff2');
}

body {
    font-family: 'MyCustomFont', sans-serif;
}

What if I want to use Google Fonts instead?

You can include Google Fonts by adding a link to the font in your HTML:

<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet'>

Then, use it in your CSS like this:

body {
    font-family: 'Roboto', sans-serif;
}

Are there any performance considerations I should keep in mind?

Yes, loading too many custom fonts can slow down your site. It's best to limit the number of font weights and styles you use.