Created
January 11, 2018 01:19
-
-
Save AndrewCraswell/106143d1bb5d4162689b9e1d89a2d0fb to your computer and use it in GitHub Desktop.
Segoe UI Web 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: SegoeUI; | |
| src: | |
| local("Segoe UI Light"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/light/latest.woff2) format("woff2"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/light/latest.woff) format("woff"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/light/latest.ttf) format("truetype"); | |
| font-weight: 100; | |
| } | |
| @font-face { | |
| font-family: SegoeUI; | |
| src: | |
| local("Segoe UI Semilight"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semilight/latest.woff2) format("woff2"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semilight/latest.woff) format("woff"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semilight/latest.ttf) format("truetype"); | |
| font-weight: 200; | |
| } | |
| @font-face { | |
| font-family: SegoeUI; | |
| src: | |
| local("Segoe UI"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/normal/latest.woff2) format("woff2"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/normal/latest.woff) format("woff"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/normal/latest.ttf) format("truetype"); | |
| font-weight: 400; | |
| } | |
| @font-face { | |
| font-family: SegoeUI; | |
| src: | |
| local("Segoe UI Bold"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/bold/latest.woff2) format("woff2"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/bold/latest.woff) format("woff"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/bold/latest.ttf) format("truetype"); | |
| font-weight: 600; | |
| } | |
| @font-face { | |
| font-family: SegoeUI; | |
| src: | |
| local("Segoe UI Semibold"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.woff2) format("woff2"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.woff) format("woff"), | |
| url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.ttf) format("truetype"); | |
| font-weight: 700; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I'm not sure how to generate the
distfolder in the giant Fluent UI monorepo, but I did find this storybook HTML file. It includes all of the Segoe web fonts weights, similar to the gist above. Seems to work well on both iOS and Android devices. (I copied the code between the<style>tags into a separate.cssfile.)