
Show HN: Terminal CSS - Gioni06
https://terminalcss.xyz/
======
franky47
I like it, I was looking for a similar look for my blog/homepage, and I got
into the issue of fallback fonts having different rendered sizes, do you have
any pointers regarding how to get a consistent layout no matter which font is
used ?

~~~
Gioni06
Hm..not really. For Terminal CSS I decided to @font-face Fira Code for
precisely that reason. Font rendering is a never-ending story when it comes to
web design. Not only that browsers render fonts differently, but the operating
system also influences it. Font rendering on Windows looks terrible IMO
compared to Mac or Linux. So "no" I don't have a solution to that problem. My
personal view is that a system font stack is an excellent choice regarding UX.
As a user, I expect a certain kind of user experience from my device/OS and a
website that respects that tends to offer a better experience than others. To
conclude: I should remove Fira Code in favor of a system stack :)

[EDIT] Github is a great example. Uses a system font stack and looks great on
all devices and operating systems:

"-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple
Color Emoji,Segoe UI Emoji,Segoe UI Symbol;"

------
Jowsey
Huh, this looks pretty cool! Seems a little niche though, I personally couldnt
see anyone using this aside from a personal blog or something - great work,
however!

~~~
Gioni06
Thanks! You are right, and it's not for everyone. I created that framework for
my website because I was unhappy with other solutions out there. Besides the
bare bone, monospace style, I added a "sans serif" variant to make it a bit
more "mainstream". My vision for 1.0 is to have a markdown friendly, no fuzz
CSS boilerplate for text-content creators.

