0
0
Fork 0
mirror of https://github.com/github/hubot-sans.git synced 2024-12-27 22:50:33 -05:00

Update README.md

This commit is contained in:
Tobias Ahlin 2022-11-09 15:55:54 +01:00 committed by GitHub
parent 3f39916ea4
commit 8891a7f613
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1,13 +1,37 @@
# Hubot Sans # Hubot Sans
[Typeface microsite](http://github.com/mona-sans) ↗️ [Download Hubot Sans](http://github.com/github/hubot-sans/releases/latest) • [Typeface microsite](http://github.com/mona-sans) ↗️
Hubot is [Monas](https://github.com/github/mona-sans) robotic sidekick. The typeface is designed with more geometric accents to lend a technical and idiosyncratic feel—perfect for headers and pull-quotes. Designed with [Degarism](https://degarism.com/). **Hubot Sans** is [Mona Sanss](https://github.com/github/mona-sans) robotic sidekick. The typeface is designed with more geometric accents to lend a technical and idiosyncratic feel—perfect for headers and pull-quotes. Made together with [Degarism](https://degarism.com/).
Hubot is a [variable font](https://web.dev/variable-fonts/). Variable fonts enable different variations of a typeface to be incorporated into one single file, and are supported by all major browsers, allowing for performance benefits and granular design control of the typeface's weight, width, and slant. Hubot Sans is a [variable font](https://web.dev/variable-fonts/). Variable fonts enable different variations of a typeface to be incorporated into one single file, and are [supported by all major browsers](https://caniuse.com/?search=variable%20fonts).
![hubot-sans](https://user-images.githubusercontent.com/99746865/200649171-0eb80908-df45-4fd5-9fc7-53403f5709da.png) ![hubot-sans](https://user-images.githubusercontent.com/99746865/200649171-0eb80908-df45-4fd5-9fc7-53403f5709da.png)
## Usage
For web, we recommend using `Mona Sans.woff2`. Define the font with a `@font-face` rule, set its **weight** and **stretch** ranges, and use it:
```css
@font-face {
font-family: 'Hubot Sans';
src:
url('Hubot-Sans.woff2') format('woff2 supports variations'),
url('Hubot-Sans.woff2') format('woff2-variations');
font-weight: 200 900;
font-stretch: 75% 125%;
}
html {
font-family: 'Hubot Sans';
}
```
To reduce [CLS](https://web.dev/cls/), you can preload the font in the `head` of your document:
```html
<link rel="preload" href="Hubot-Sans.woff2" as="font" type="font/woff2" crossorigin>
```
## Styles ## Styles
| Style Name | Italic Name | Weight | Width | | Style Name | Italic Name | Weight | Width |
| --- | --- | --- | --- | | --- | --- | --- | --- |