Search code examples
htmlbootstrap-4webfonts

Bootstrap 4 Roboto font family


I'm new to Bootstrap, I have version 4.1.1 installed locally (node.js, npm, gulp and sass).

Sorry if this is a dumb question, but do I have to import the Roboto font family from Google, or is this font already imported by Bootstrap? I don't want to add any redundant css.

Thanks! Bob :)


Solution

  • Bootstrap does not include any fonts, it relies on system fonts. So, if you want to use any Google Font (or other), you have to import it yourself.

    To do so, you can add:

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

    Google makes some other suggestions when you import a font, that will help performance:

    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">