Credit: Raphael Schaller

Notes

Claude Ligatures

Claude and Impeccable are silently destroying your ligatures.

I've been seeing a trend with designs created by Claude and Impeccable. Calling this a "trend" is even underselling it. It's pretty much universal across the board.

Every design I see coming out of Impeccable and Claude puts some form of letter-spacing in your CSS. This destroys any ligatures your font may support.

If you're not familiar, here's what I mean by ligatures:

Ligatures give your typography a bespoke feel. They make your font selections feel purposeful and unique. Especially for long-form content. When you (or your AI) use any value for letter-spacing (ie tracking), ligatures can no longer be calculated because the font doesn't know how to render the combined characters with a non-default distance between them.

So how do you fix it? I'm glad you asked. Just remove anything in your CSS that looks like the following:

.title { letter-spacing: 0.01rem; }

Share this piece

About fragment