Text Baseline Alignment / Text Cropping

It is very difficult to get true text alignment with Lunacy.

For example, if I am making a button with Lunacy, I may have perfect 4px padding all the way around the text (indicated by the light grey), but the text itself has extra spacing above the letters (indicated by the medium grey). In reality, I want to align the button (indicated by the light grey) with 4px padding around the letters themselves (dark grey).

For more information, see https://medium.com/eightshapes-llc/cropping-away-negative-impacts-of-line-height-84d744e016ce

Other tools, like Sketch, use true text alignment, even when distributing objects vertically.


  • 1 Comment sorted by Votes Date Added
  • Unfortunately, there is a big difference between the two, and these inconsistencies add up over time:

    The top button uses true text alignment, while the bottom button uses the text box bounds.

    Notice the large space above the text in the bottom button that makes the whole button feel misaligned.

Sign In or Register to comment.