archive/inter-font
Archived
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update web snippet for better performance

Browse source
This commit is contained in:
Vadim Makeev 2022-07-18 09:54:11 +02:00
parent 5404f90640
commit 1188b12eb6
2 changed files with 21 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

16
README.md
View file

@ -29,11 +29,20 @@ several [OpenType features](https://rsms.me/inter/#features), like contextual al
- To use Inter on a web page, use the official - To use Inter on a web page, use the official
[CDN distribution:](https://rsms.me/inter/inter.css) [CDN distribution:](https://rsms.me/inter/inter.css)
```html
<link rel="preconnect" href="https://rsms.me/">
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
```
```css ```css
@import url('https://rsms.me/inter/inter.css'); html {
html { font-family: 'Inter', sans-serif; } font-family: 'Inter', sans-serif;
}
@supports (font-variation-settings: normal) { @supports (font-variation-settings: normal) {
html { font-family: 'Inter var', sans-serif; } html {
font-family: 'Inter var', sans-serif;
}
} }
``` ```
@ -149,4 +158,3 @@ Translating between EM units and pixels:
- Rasterized at 11px: 1px = 256 units - Rasterized at 11px: 1px = 256 units
- Rasterized at 22px: 1px = 128 units - Rasterized at 22px: 1px = 128 units
- Rasterized at 44px: 1px = 64 units - Rasterized at 44px: 1px = 64 units

12
docs/index.html
View file

@ -87,10 +87,16 @@ endfor
the font files. If you're making a web thing, you can use the following CSS. the font files. If you're making a web thing, you can use the following CSS.
<!-- or get it from <a href="https://fonts.google.com/specimen/Inter">Google Fonts</a>. --> <!-- or get it from <a href="https://fonts.google.com/specimen/Inter">Google Fonts</a>. -->
</p> </p>
<pre>@import url('https://rsms.me/inter/inter.css'); <pre>&lt;link rel=&quot;preconnect&quot; href=&quot;https://rsms.me/&quot;&gt;
html { font-family: 'Inter', sans-serif; } &lt;link rel=&quot;stylesheet&quot; href=&quot;https://rsms.me/inter/inter.css&quot;&gt;</pre>
<pre>html {
font-family: 'Inter', sans-serif;
}
@supports (font-variation-settings: normal) { @supports (font-variation-settings: normal) {
html { font-family: 'Inter var', sans-serif; } html {
font-family: 'Inter var', sans-serif;
}
}</pre> }</pre>
</c> </c>