---------- 2022-12-06, 週2
GitHub, Mona Sans, Hubot Sans.
https://github.com/mona-sans
MONA SANS
A strong and versatile typeface, designed with Degarism and inspired by industrial-era grotesques. Mona Sans works well across product, web, and print.
HUBOT SANS
Mona’s robotic sidekick. More geometric accents lend a technical and idiosyncratic feel—perfect for headers and pull‑quotes.
https://github.com/github/mona-sans
mona-sans-main.zip
https://github.com/github/mona-sans/releases/tag/v1.0
Mona.Sans.1.0.zip (字型),
mona-sans-1.0.zip (Source code)
https://github.com/github/hubot-sans
hubot-sans-main.zip
https://github.com/github/hubot-sans/releases/tag/v1.0
Hubot.Sans.1.0.zip (字型),
hubot-sans-1.0.zip (Source code)
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:
@font-face {
font-family: 'Mona Sans';
src:
url('Mona-Sans.woff2') format('woff2 supports variations'),
url('Mona-Sans.woff2') format('woff2-variations');
font-weight: 200 900;
font-stretch: 75% 125%;
}
html {
font-family: 'Mona Sans';
}
To reduce CLS, you can preload the font in the head of your document:
License
Mona Sans is licensed under the SIL Open Font License v1.1.
Usage
For web, we recommend using Hubot-Sans.woff2. Define the font with a @font-face rule, set its weight and stretch ranges, and use it:
@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, you can preload the font in the head of your document:
License
Hubot Sans is licensed under the SIL Open Font License v1.1.
Mona Sans和Hubot Sans
GitHub開源兩可變式字體Mona Sans、Hubot Sans
GitHub開源了自家設計的兩款字型,分別是Mona Sans以及Hubot Sans,這兩款字型都是可變式字體,能靈活支援各式內容呈現,具有可變傾斜度、粗細和寬度,現在GitHub以開源字體授權(OFL)對外釋出。
Mona Sans是GitHub主要的跨媒體字體,其設計靈感來自工業時代的怪奇風格,由GitHub和Degarism工作室合作設計,Mona Sans可變粗細和寬度,無論是在產品、網頁、印刷品都能保有良好的表現力,GitHub在主文、標題到引文等各種內容都會使用Mona Sans。GitHub提到,因為Mona Sans可以任意的彎曲和適應各種設計,在需要更具表現力的排版,也能保持字體品質。
Hubot Sans則是Mona Sans的姐妹設計,但是帶有額外的機器人風格,加入更多幾何元素,營造出技術與獨樹一格感覺,適合用於標題和引用,是GitHub第二主要品牌字體,在ReadME專案和GitHub Universe網站都會看到Hubot Sans的使用。
Mona Sans和Hubot Sans同時可用作靜態與動態字體,可變字體單一字體檔案打包了一組可變軸,用戶便可以精細的控制字體呈現,包括控制向量點使字體呈現特殊的外觀和呈現,同時也可以調整寬度,這賦予用戶可以將同一字體應用在各種內容和需求,而不需要針對各種新用例都載入和安裝新的字體檔案。
Mona Sans和Hubot Sans都帶有三個可變軸,分別是可控制粗細的權重,以及調整壓縮和擴展的寬度,還有可控制傾斜的斜度,用戶自由組合這些控制軸,就能夠創造出數千種不同字型外觀和表現。