299: How to Set-up Font on CodePen

https://fonts.google.com/?query=playf&selection.family=Playfair+Display:900|Roboto:300

Click HTML Gear and place the following link in the Stuff for <head> box.

<link href=”https://fonts.googleapis.com/css?family=Playfair+Display:900|Roboto:300” rel=”stylesheet”>

Then add the following two lines in the style.css file at the appropriate place to declare the fonts.

font-family: ‘Roboto’, sans-serif;
font-family: ‘Playfair Display’, serif;

For example,

h1 {
font-family: ‘Playfair Display’, serif;
font-weight: 900;
font-size: 72px;
}

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s