posts-go/docs/2023-03-30-fonts.html

298 lines
8.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.2.0/github-markdown-dark.min.css"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Inter&family=JetBrains+Mono&family=Martian+Mono&family=Recursive&display=swap"
rel="stylesheet"
/>
<title>haunt98 posts</title>
</head>
<style>
.markdown-body {
box-sizing: border-box;
min-width: 200px;
max-width: 980px;
margin: 0 auto;
padding: 45px;
}
@media (max-width: 767px) {
.markdown-body {
padding: 15px;
}
}
.markdown-body {
font-family: "Inter", sans-serif;
<!-- font-family: "Recursive", sans-serif; -->
}
.markdown-body code,
.markdown-body pre {
font-family: "JetBrains Mono", monospace;
<!-- font-family: "Martian Mono", monospace; -->
}
</style>
<body class="markdown-body">
<div><a href="index.html">Index</a></div>
<h1>
<a id="user-content-fonts" class="anchor" aria-hidden="true" href="#fonts"
><span aria-hidden="true" class="octicon octicon-link"></span></a
>Fonts
</h1>
<p>
I always want the best fonts for my terminal, my text editor, my ... But
I'm not satisfied easily, so I keep trying new fonts. Prefer free fonts of
course :D
</p>
<p>TLDR:</p>
<ul>
<li>
Use
<a href="https://github.com/JetBrains/JetBrainsMono">JetBrains Mono</a>
for code.
</li>
<li>
Use <a href="https://github.com/rsms/inter">Inter</a> for everything
else.
</li>
</ul>
<p>
All images belows is official images I got from fonts website or github.
I'm too lazy to screenshot anw :D
</p>
<h2>
<a
id="user-content-jetbrains-mono"
class="anchor"
aria-hidden="true"
href="#jetbrains-mono"
><span aria-hidden="true" class="octicon octicon-link"></span></a
>JetBrains Mono
</h2>
<ul>
<li>Support Vietnamese</li>
<li>Support bold, italic</li>
<li>Support ligatures</li>
</ul>
<p>
<a
target="_blank"
rel="noopener noreferrer"
href="https://github.com/JetBrains/JetBrainsMono/raw/master/images/character-set@2x.png"
><img
src="https://github.com/JetBrains/JetBrainsMono/raw/master/images/character-set@2x.png"
alt="img00"
style="max-width: 100%"
/></a>
</p>
<h2>
<a
id="user-content-iosevka"
class="anchor"
aria-hidden="true"
href="#iosevka"
><span aria-hidden="true" class="octicon octicon-link"></span></a
><a href="https://github.com/be5invis/Iosevka">Iosevka</a>
</h2>
<p>
I often choose SS08 variant because I also love
<a href="https://fsd.it/shop/fonts/pragmatapro/" rel="nofollow"
>PragmataPro</a
>
too.
</p>
<ul>
<li>Support Vietnamese</li>
<li>Support bold, italic</li>
<li>Support ligatures</li>
<li>Support display font (non mono)</li>
</ul>
<p>Font is narrow, can display much more on small screen.</p>
<p>
<a
target="_blank"
rel="noopener noreferrer nofollow"
href="https://raw.githubusercontent.com/be5invis/Iosevka/v21.1.1/images/iosevka-ss08.dark.svg#gh-dark-mode-only"
><img
src="https://raw.githubusercontent.com/be5invis/Iosevka/v21.1.1/images/iosevka-ss08.dark.svg#gh-dark-mode-only"
alt="img01"
style="max-width: 100%"
/></a>
</p>
<h2>
<a
id="user-content-recursive"
class="anchor"
aria-hidden="true"
href="#recursive"
><span aria-hidden="true" class="octicon octicon-link"></span></a
><a href="https://github.com/arrowtype/recursive">Recursive</a>
</h2>
<p>I often choose Casual variant.</p>
<ul>
<li>Support Vietnamese</li>
<li>Support bold, italic</li>
<li>Support ligatures</li>
<li>Support display font (non mono)</li>
</ul>
<p>Looks good on my phone.</p>
<p>
<a
target="_blank"
rel="noopener noreferrer nofollow"
href="https://raw.githubusercontent.com/haunt98/posts-images/main/android-000.jpg"
><img
src="https://raw.githubusercontent.com/haunt98/posts-images/main/android-000.jpg"
alt="android-000"
style="max-width: 100%"
/></a>
</p>
<h2>
<a
id="user-content-martian-mono"
class="anchor"
aria-hidden="true"
href="#martian-mono"
><span aria-hidden="true" class="octicon octicon-link"></span></a
><a href="https://github.com/evilmartians/mono">Martian Mono</a>
</h2>
<ul>
<li>No Vietnamese</li>
<li>Support bold</li>
<li>No italic</li>
<li>No ligatures</li>
</ul>
<p>
Font is wide, remember to edit line height to make it looks good. I like
its bold, strong look.
</p>
<p>
<a
target="_blank"
rel="noopener noreferrer"
href="https://github.com/evilmartians/mono/raw/main/documentation/martian-mono-character-set.png"
><img
src="https://github.com/evilmartians/mono/raw/main/documentation/martian-mono-character-set.png"
alt="img02"
style="max-width: 100%"
/></a>
</p>
<h2>
<a id="user-content-agave" class="anchor" aria-hidden="true" href="#agave"
><span aria-hidden="true" class="octicon octicon-link"></span></a
><a href="https://github.com/blobject/agave">agave</a>
</h2>
<ul>
<li>No Vietnamese</li>
<li>Support bold</li>
<li>No italic</li>
<li>No ligatures</li>
</ul>
<p>
Font is small, can display much more on small screen. I like its curved
look.
</p>
<h2>
<a
id="user-content-hermit"
class="anchor"
aria-hidden="true"
href="#hermit"
><span aria-hidden="true" class="octicon octicon-link"></span></a
><a href="https://github.com/pcaro90/hermit">Hermit</a>
</h2>
<ul>
<li>No Vietnamese</li>
<li>Support bold, italic</li>
<li>No ligatures</li>
</ul>
<p>Looks unique to me, with some sharp look.</p>
<h2>
<a
id="user-content-apl-385-and-apl386"
class="anchor"
aria-hidden="true"
href="#apl-385-and-apl386"
><span aria-hidden="true" class="octicon octicon-link"></span
></a>
<a href="https://apl385.com/fonts/index.htm" rel="nofollow">APL-385</a>
and <a href="https://github.com/abrudz/APL386">APL386</a>
</h2>
<ul>
<li>No Vietnamese</li>
<li>No bold, italic</li>
<li>No ligatures (APL386 support)</li>
</ul>
<p>I love its wide look, also it's feel nostalgic.</p>
<h2>
<a
id="user-content-cozette"
class="anchor"
aria-hidden="true"
href="#cozette"
><span aria-hidden="true" class="octicon octicon-link"></span></a
><a href="https://github.com/slavfox/Cozette">Cozette</a>
</h2>
<ul>
<li>No Vietnamese</li>
<li>No bold, italic</li>
<li>No ligatures</li>
</ul>
<p>Feel nostalgic. But sometimes it's hard to read.</p>
<p>
<a
target="_blank"
rel="noopener noreferrer"
href="https://github.com/slavfox/Cozette/raw/master/img/sample.png"
><img
src="https://github.com/slavfox/Cozette/raw/master/img/sample.png"
alt="img03"
style="max-width: 100%"
/></a>
</p>
<h2>
<a
id="user-content-murr-fonts-but-i-dont-use-much"
class="anchor"
aria-hidden="true"
href="#murr-fonts-but-i-dont-use-much"
><span aria-hidden="true" class="octicon octicon-link"></span></a
>Murr fonts, but I don't use much
</h2>
<ul>
<li>
<a href="https://github.com/tonsky/FiraCode">Fira Code</a>: best
ligatures.
</li>
<li>
<a href="https://github.com/microsoft/cascadia-code">Cascadia Code</a>
</li>
<li><a href="https://input.djr.com/" rel="nofollow">Input</a></li>
<li><a href="https://github.com/larsenwork/monoid">Monoid</a></li>
<li>
<a href="https://github.com/belluzj/fantasque-sans"
>Fantasque Sans Mono</a
>
</li>
<li><a href="https://github.com/madmalik/mononoki">mononoki</a></li>
</ul>
<div>
Feel free to ask me via
<a href="mailto:hauvipapro+posts@gmail.com">email</a> or
<a rel="me" href="https://hachyderm.io/@haunguyen">Mastodon</a>. Source
code is available on
<a href="https://github.com/haunt98/posts-go">GitHub</a>
</div>
</body>
</html>