I'm not a type designer, so I might be mistaken, but the vertical alignment of Space Grotesk appears to be shifted too high when vertically centering the typeface in UI, and when compared to other typefaces.
I did a comparison of Space Grotesk Regular at 20px font size and 24px line-height/leading compared to other common sans-serif typefaces. I found that the baseline for Space Grotesk was 2 to 3 pixels higher within its bounding box compared to many other typefaces.
In this image, I'm only showing a few typefaces for a quick example, but I did this comparison with many others and found other typefaces to consistently have the baseline along the bottom two red guidelines (2 to 3 pixels lower than Space Grotesk's baseline). The blue box in this image depicts the bounding box, which is consistent across all samples, and represents the text's impact on layout for the web.
When I'm using Space Grotesk in my web work, I often have to compensate for this by manually shifting the text down by 1 or 2 pixels for things to be optically centered. This requires asymmetrical margins or padding and can be quite difficult to achieve in certain situations where layout is handled more globally.
If Space Grotesk had it's baseline shifted down by 2 pixels, it appears to better centered vertically:
To me, this looks more balanced, but would also save a substantial amount of effort when using it in projects.
mightybart
commented
3 years ago
I'm not a type designer, so I might be mistaken, but the vertical alignment of Space Grotesk appears to be shifted too high when vertically centering the typeface in UI, and when compared to other typefaces.
I did a comparison of Space Grotesk Regular at 20px font size and 24px line-height/leading compared to other common sans-serif typefaces. I found that the baseline for Space Grotesk was 2 to 3 pixels higher within its bounding box compared to many other typefaces.
In this image, I'm only showing a few typefaces for a quick example, but I did this comparison with many others and found other typefaces to consistently have the baseline along the bottom two red guidelines (2 to 3 pixels lower than Space Grotesk's baseline). The blue box in this image depicts the bounding box, which is consistent across all samples, and represents the text's impact on layout for the web.
When I'm using Space Grotesk in my web work, I often have to compensate for this by manually shifting the text down by 1 or 2 pixels for things to be optically centered. This requires asymmetrical margins or padding and can be quite difficult to achieve in certain situations where layout is handled more globally.
If Space Grotesk had it's baseline shifted down by 2 pixels, it appears to better centered vertically:
To me, this looks more balanced, but would also save a substantial amount of effort when using it in projects.
I'm interested in hearing thoughts on this.