Created
November 22, 2019 02:34
-
-
Save jentanbernardus/2069af4c41e0f0cbd144295b9c95bac3 to your computer and use it in GitHub Desktop.
The Inter typeface family - https://rsms.me/inter/inter.css #fonts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 100; | |
font-display: swap; | |
src: url("font-files/Inter-Thin.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Thin.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 100; | |
font-display: swap; | |
src: url("font-files/Inter-ThinItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-ThinItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 200; | |
font-display: swap; | |
src: url("font-files/Inter-ExtraLight.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-ExtraLight.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 200; | |
font-display: swap; | |
src: url("font-files/Inter-ExtraLightItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-ExtraLightItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 300; | |
font-display: swap; | |
src: url("font-files/Inter-Light.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Light.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 300; | |
font-display: swap; | |
src: url("font-files/Inter-LightItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-LightItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 400; | |
font-display: swap; | |
src: url("font-files/Inter-Regular.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Regular.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 400; | |
font-display: swap; | |
src: url("font-files/Inter-Italic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Italic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 500; | |
font-display: swap; | |
src: url("font-files/Inter-Medium.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Medium.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 500; | |
font-display: swap; | |
src: url("font-files/Inter-MediumItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-MediumItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 600; | |
font-display: swap; | |
src: url("font-files/Inter-SemiBold.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-SemiBold.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 600; | |
font-display: swap; | |
src: url("font-files/Inter-SemiBoldItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-SemiBoldItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 700; | |
font-display: swap; | |
src: url("font-files/Inter-Bold.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Bold.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 700; | |
font-display: swap; | |
src: url("font-files/Inter-BoldItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-BoldItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 800; | |
font-display: swap; | |
src: url("font-files/Inter-ExtraBold.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-ExtraBold.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 800; | |
font-display: swap; | |
src: url("font-files/Inter-ExtraBoldItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-ExtraBoldItalic.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: normal; | |
font-weight: 900; | |
font-display: swap; | |
src: url("font-files/Inter-Black.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-Black.woff?v=3.11") format("woff"); | |
} | |
@font-face { | |
font-family: 'Inter'; | |
font-style: italic; | |
font-weight: 900; | |
font-display: swap; | |
src: url("font-files/Inter-BlackItalic.woff2?v=3.11") format("woff2"), | |
url("font-files/Inter-BlackItalic.woff?v=3.11") format("woff"); | |
} | |
/* ------------------------------------------------------- | |
Variable font. | |
Usage: | |
html { font-family: 'Inter', sans-serif; } | |
@supports (font-variation-settings: normal) { | |
html { font-family: 'Inter var', sans-serif; } | |
} | |
*/ | |
@font-face { | |
font-family: 'Inter var'; | |
font-weight: 100 900; | |
font-style: normal; | |
font-named-instance: 'Regular'; | |
font-display: swap; | |
src: url("font-files/Inter-roman.var.woff2?v=3.11") format("woff2"); | |
} | |
@font-face { | |
font-family: 'Inter var'; | |
font-weight: 100 900; | |
font-style: italic; | |
font-named-instance: 'Italic'; | |
font-display: swap; | |
src: url("font-files/Inter-italic.var.woff2?v=3.11") format("woff2"); | |
} | |
/* Legacy naming compatibility */ | |
@font-face { | |
font-family: 'Inter var alt'; | |
font-weight: 100 900; | |
font-style: normal; | |
font-named-instance: 'Regular'; | |
font-display: swap; | |
src: url("font-files/Inter-roman.var.woff2?v=3.11") format("woff2"); | |
} | |
@font-face { | |
font-family: 'Inter var alt'; | |
font-weight: 100 900; | |
font-style: italic; | |
font-named-instance: 'Italic'; | |
font-display: swap; | |
src: url("font-files/Inter-italic.var.woff2?v=3.11") format("woff2"); | |
} | |
/* -------------------------------------------------------------------------- | |
[EXPERIMENTAL] Multi-axis, single variable font. | |
Slant axis is not yet widely supported (as of February 2019) and thus this | |
multi-axis single variable font is opt-in rather than the default. | |
When using this, you will probably need to set font-variation-settings | |
explicitly, e.g. | |
* { font-variation-settings: "slnt" 0deg } | |
.italic { font-variation-settings: "slnt" 10deg } | |
*/ | |
@font-face { | |
font-family: 'Inter var experimental'; | |
font-weight: 100 900; | |
font-style: oblique 0deg 10deg; | |
font-display: swap; | |
src: url("font-files/Inter.var.woff2?v=3.11") format("woff2"); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment