How to add a custom font? #1540
-
|
How do I add my favorite font to Blink Shell? How about Nerd fonts? |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment
-
How to add custom font?The simplest way to add custom fonts inside Blink Shell is by using CSS. The fonts can be loaded from a remote server, or by converting them to base64. Nerd fonts should work without issue following this method. You can browse our gallery to see if we can already save you some work. Base64To convert your fonts, we recommend the Transfonter tool. It will automatically generate a stylesheet you can import right into Blink Shell. Or by using any other converter and manually the following CSS. You can upload the CSS as a Gist for easier access. @font-face {
font-family: "Fira Code";
font-style: normal;
font-weight: 200;
src: url(data:font/woff;charset=utf-8;base64,<base64 dump>);
}
@font-face {
font-family: "Fira Code";
font-style: normal;
font-weight: 400;
src: url(data:font/woff;charset=utf-8;base64,<base64 dump>);
}Remote fontThe second option is loading it from a remote server. This way has its downsides. If you move the font, the local installation will break, and you'll need to reconfigure and import it again. @font-face {
font-family: "Fira Code";
font-weight: 400;
src: url('https://example.com/fonts/fira_code_regular.otf' format('opentype'));
}
@font-face {
font-family: "Fira Code";
font-weight: 600;
src: url('https://example.com/fonts/fira_code_medium.ttf' format('truetype'));
}
@font-face {
font-family: "Fira Code";
font-weight: 800;
src: url('https://example.com/fonts/fira_code_bold.woff' format('woff'));
}Importing the font to Blink ShellInside settings, click the Add a name for it and insert a link to the stylesheet. We recommend using GitHub Gist for that. Click import, and that's it! You can now select it from settings, open a new window of Blink Shell and enjoy your new font. More information
|
Beta Was this translation helpful? Give feedback.
How to add custom font?
The simplest way to add custom fonts inside Blink Shell is by using CSS. The fonts can be loaded from a remote server, or by converting them to base64. Nerd fonts should work without issue following this method. You can browse our gallery to see if we can already save you some work.
Base64
To convert your fonts, we recommend the Transfonter tool. It will automatically generate a stylesheet you can import right into Blink Shell. Or by using any other converter and manually the following CSS. You can upload the CSS as a Gist for easier access.