foster/github-hubot-sans
0
0
Fork 0
mirror of https://github.com/github/hubot-sans.git synced 2024-12-27 22:50:33 -05:00
Code Issues Packages 3 Activity

Update README.md

Browse source
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
1 changed files with 27 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
README.md
View file

@ -1,13 +1,37 @@
# 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 [Mona’s](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 Sans’s](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)
## 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
| Style Name | Italic Name | Weight | Width |
| --- | --- | --- | --- |