There is more to this https://resilientwebdesign.com
That looks horrific too why is there an enormous amount of space between each letter, word, and line.
Tufte CSS
11–20 of 50 posts
Re: Tufte CSS
#12Re: Tufte CSS
#13There is more to this https://resilientwebdesign.com
That looks horrific too why is there an enormous amount of space between each letter, word, and line.
The line height is cranked up to 1.75 and font size is derived from the view width:
calc( 1em + (2 - 1) * ( (100vw - 20em) / ( 100 - 20) ))
Re: Tufte CSS
#14I recall quite liking the typography on this website the first time I saw it years ago. It's amazing how much it has dated for me since (I think primarily due to being liberally copied exactly in too many places around the web). > a reminder about the goal of this project. The web is not print. Webpages are not books. Therefore, the goal of Tufte CSS is not to say “websites should look like this interpretation of Tuf…
Really? I took an immediate dislike to it. Same for the site linked in the comments below - https://resilientwebdesign.com
It reminds me of the printing found in 200 year old books. I can't quite put my finger on what I don't like about it, but it grates. Perhaps it's inconsistent letter shapes.
Can anyone more informed comment on the font?
Re: Tufte CSS
#15How many times will Tufte CSS be reposted? I feel like I see this every year. Unfortunately I like it less every year too.
I think posting Tufte CSS, upvoting it, and complaining about it in the comments is a bit of an HN tradition at this point. Here's the first iteration from ten years back: https://news.ycombinator.com/item?id=10012360
Re: Tufte CSS
#16How many times will Tufte CSS be reposted? I feel like I see this every year. Unfortunately I like it less every year too.
Was going to say maybe time to add a (2015) to it, but it does look like there's been incremental updates in recent years with tweaks and things like dark mode etc.
Re: Tufte CSS
#17> Although paper handouts obviously have a pure white background, the web is better served by the use of slightly off-white and off-black colors. Tufte CSS uses #fffff8 and #111111 because they are nearly indistinguishable from their ‘pure’ cousins, but dial down the harsh contrast.
I never got this argument.
I can see an argument for "We need to reserve some headroom and footroom for Darker Than Common Black and Brighter Than Common White for occasional emphasis scenarios. Or, for differentiation from pure black/white in images and background elements."
But, I read "dial down the harsh contrast" as "We presume users have their monitor contrast settings set too high and intentionally use a reduced range to compensate for their mistake even though it costs us a bit of color precision."
Meanwhile, I might have an LCD monitor with the contrast dialed down next to an OLED with the brightness and contrast cranked up. And, even if the common case user setup is not so extreme, it still varies wildly in practice.
As a game engine developer, this is something I've had to deal with in practice for a long time... Reduced contrast range as a stylistic choice can be quite valid. But, trying to predict user viewing conditions is wishful thinking.
Re: Tufte CSS
#18> Although paper handouts obviously have a pure white background, the web is better served by the use of slightly off-white and off-black colors. Tufte CSS uses #fffff8 and #111111 because they are nearly indistinguishable from their ‘pure’ cousins, but dial down the harsh contrast. I never got this argument. I can see an argument for "We need to reserve some headroom and footroom for Darker Than Common Black and Bri…
The author's conclusion is flawed: paper and ink are never truly pure white or black. Perfect white/black exists only in digital spaces, while physical materials always have subtle variations in tone and color.
Re: Tufte CSS
#19Previously:
Tufte CSS - https://news.ycombinator.com/item?id=42820449 - Jan 2025 (4 comments)
Tufte CSS - https://news.ycombinator.com/item?id=35032334 - March 2023 (32 comments)
Tufte CSS - https://news.ycombinator.com/item?id=23828196 - July 2020 (9 comments)
Show HN: A minimalist blog based on Tufte CSS - https://news.ycombinator.com/item?id=19615895 - April 2019 (74 comments)
Tufte CSS - https://news.ycombinator.com/item?id=15633102 - Nov 2017 (59 comments)
Tufte CSS - https://news.ycombinator.com/item?id=10555319 - Nov 2015 (26 comments)
Tufte CSS - https://news.ycombinator.com/item?id=10012360 - Aug 2015 (103 comments)
Re: Tufte CSS
#20> Although paper handouts obviously have a pure white background, the web is better served by the use of slightly off-white and off-black colors. Tufte CSS uses #fffff8 and #111111 because they are nearly indistinguishable from their ‘pure’ cousins, but dial down the harsh contrast. I never got this argument. I can see an argument for "We need to reserve some headroom and footroom for Darker Than Common Black and Bri…
Not using #000000 for background black removes an opportunity for your site to look awesome on OLED screens.