Try Atkinson Hyperlegible font in the editor/preview. I just love it.
About “Atkinson Hyperlegible”: What makes it different from traditional typography design is that it focuses on letterform distinction to increase character recognition, ultimately improving readability. We are making it free for anyone to use!
``
.theme-light {
–font-family-editor: “Atkinson Hyperlegible”,
inter !important;
–font-family-preview: “Atkinson Hyperlegible”,
inter !important;
font-family: “Atkinson Hyperlegible” !important;
}
I do not find Atkinson particularly hyperlegible: to me it look like a normal variable width font.
I find monospaced fonts more legible, and use Space Mono, MonoLisa, and Monaco for both Edit and Preview. I find the letters to be better shaped and spaced.