The-Complete-Web-Development-Bootcamp/main/06 - Introduction to Bootstrap 4/73 - Getting Montserrat Black and other Font Weights.html

<p><strong>Tl;DR If you have problems getting a Montserrat-Black to work check back to this note for the solution.</strong></p><p>Hey guys,</p><p>In the next lesson, I'll be introducing you to Google fonts. Some students have had issues getting the bolder Montserrat black to show up because Google has updated their website UI. In order to get the different font weights of the Google font, you need to <strong>include</strong> it when you select it in Google fonts.</p><p>So when you are on the font page, make sure you select the 100, 400 and 900 font weights, e.g.</p><figure><img src="https://img-b.udemycdn.com/redactor/raw/2020-09-22_11-23-12-1b7bdbcf9730f9d634a1b4fcb0558833.png"></figure><p>Next, look at the right-hand pane and make sure that you have all the desired font weights and then click on the Embed tab.</p><figure><img src="https://img-b.udemycdn.com/redactor/raw/2020-09-22_11-24-30-75a530449e636bb2f05e2fe3053f5fd8.png"></figure><p>Now you should be able to copy the stylesheet link for the font and use it in your CSS.</p><figure><img src="https://img-b.udemycdn.com/redactor/raw/2020-09-22_11-25-18-efbae2387fd9593ce9a877e6f3a357bc.png"></figure><p><br></p><p>So the final code should look like this:</p><p><br></p><pre class="prettyprint linenums">&lt;link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;500;900&amp;family=Ubuntu:wght@300;400;700&amp;display=swap" rel="stylesheet"&gt;</pre><pre class="prettyprint linenums">h1 {  font-family: 'Montserrat, sans-serif';  font-size: 3rem;  line-height: 1.5;  font-weight: 900;}</pre>