「Stylus」でChromeの閲覧環境のフォントを変更する

はじめに

フォント変更の手順

1. 事前に、使用したいフォントをPCのローカル環境にインストールしておく必要があります。
• Lato
Google Fonts
Making the web more beautiful, fast, and open through great typography
https://fonts.google.com/specimen/Lato
• オープンソースのフォントでは、GoogleとAdobeが共同開発した「Noto Sans CJK（源ノ角ゴシック）」も良さげ
Google Noto Fonts
When text is rendered by a computer, sometimes characters are displayed as "tofu". They are little boxes to indicate your device doesn't have a font to display the text. Google has been developing a font family called Noto, which aims to support all languages with a harmonious look and feel.
https://www.google.com/get/noto/

2. 普段使っているブラウザフォントを、「What Font」で調べてください。 このフォントをStylusで置き換えていきます。
What Font - find font
Lets you know what font is used on any website
https://chrome.google.com/webstore/detail/what-font-find-font/djgfpbegnihdgbngpmhjnlchgglngcdn

3. 僕がstylusに書いたcssはこちら。
• フォントごとに、weightのnormalとboldを一つ一つ変更するだけです。
• Macであれば、「Font Book」というアプリでローカルなフォントを管理しています。 の中には、フォントのを入れると良いとのこと。

4. 単純なcssですが、かなり見やすくなった気がします。





 

「stylus」でサイドバーの非表示もしたいな

🖥️「Stylus」でTwitter, YouTube, Instagramのサイドバーを非表示にする2021/6/22 22:232023/11/30 9:03