Typography
Since Blue Web builds on top of Bootstrap, you should also check out their section about typography.
Inter as font family
Blue Web is configured to use Inter with some preset font features. The required font files aren’t included with Blue Web. Please take a look at the documentation by Inter to find out how to install them.
As fallback, when Inter couldn’t be loaded, the default font family setting by Bootstrap ($font-family-sans-serif) will be used, which is a native font stack that selects the best font-family for each OS and device.
Extend font features
Font features are stored inside the CSS variable --blue-font-feature-settings. This allows you to extend them without overriding them:
This text is not condensed.
This text is condensed.
Code
<p>This text is not condensed.</p>
<p style="font-variation-settings: var(--blue-font-feature-settings), 'opsz' 32;">This text is condensed.</p>Grab the code
When you don't use the entire Blue Web library, you can also just copy and paste the required code into your own project.
-
Copy and paste the following code into your project. Source: @/dist/styles/_inter.scss