FontPreview
Back to Guides
REAL TALK FROM A DESIGNER WHO MESSED UP

I Picked Fonts by "Vibe" for 3 Years.
It Didn't Work.

I used to open Google Fonts, scroll until something "felt right," and send it to clients. Sometimes it worked. Sometimes they emailed back saying the site looked "unprofessional" and I had to figure out why. This is the system I wish I had back then.

Here's something I'm embarrassed to admit: I once pitched a brand identity to a client using Comic Sans. I was trying to be "playful." They did not hire me.

That was 2022. I was fresh out of a bootcamp, convinced that design was about "breaking rules" and "thinking different." I didn't understand that fonts carry baggage — decades of cultural associations that users feel instantly. Comic Sans isn't playful to most people. It's unprofessional. I learned this the hard way, while eating the cost of a rebrand I caused.

This article isn't theory. It's the checklist I built after losing clients, fixing other people's font mistakes, and eventually building FontPreview because I was tired of guessing. If you're still picking fonts based on "vibes," read this before your next client call.

1. Fonts Are Not Neutral

Every font has emotional baggage. You don't get to decide what it means — users decide based on every website, poster, and movie title they've seen using that font.

Example I learned this the hard way
Client Project

❌ What I thought: "Friendly and approachable"

✅ What client heard: "You didn't take this seriously"

Client Project

❌ What I thought: "Clean and modern"

✅ What client heard: "Efficient and trustworthy"

Now I ask clients this question before I open any font picker: "If this brand was a person, what would they wear to a meeting?" A suit? A hoodie? A vintage jacket? The font is the outfit. Don't send someone to a board meeting in beachwear.

2. Three Font Choices I Still Regret

❌ Mistake #1: Lobster for Everything

Year: 2023
Project: A legal consultancy website
What I did: Used Lobster for all headings. I thought it added "personality."
What happened: The client said it looked like a seafood restaurant.

Lesson: Script fonts are not "fun" — they're specific. Lobster belongs on food trucks, not law firms.

❌ Mistake #2: Papyrus for "Authenticity"

Year: 2024
Project: A sustainable fashion brand
What I did: Used Papyrus to feel "natural" and "earthy."
What happened: A user literally emailed them: "Is this Avatar?"

Lesson: Some fonts are so overused they've lost all meaning. Papyrus isn't nature — it's a meme.

❌ Mistake #3: Impact for Readability

Year: 2024
Project: A nonprofit's annual report
What I did: Used Impact for body text (yes, really). I thought it looked "bold and confident."
What happened: Users couldn't read more than two sentences. The report had a 78% bounce rate.

Lesson: Display fonts are for display. Body text needs to disappear, not shout.

3. The "Afsar" Font Selection Framework

After enough failures, I built a simple 4-question checklist. I don't approve a font until I can answer all four.

🎭

1. Personality match

Does this font dress like the brand would dress?

👁️

2. Legibility at 14px

Can I read it on my phone in bright sunlight?

🌓

3. Dark mode test

Does it bleed or look fuzzy on black?

4. Weight efficiency

Do I need 9 weights or just 2?

My process now: I open FontPreview, paste the client's actual homepage headline, and cycle through fonts while asking: "Does this feel like them or just me?" If I can't explain why a font fits in one sentence, I delete it.

4. The "I Can't Read This" Problem

Here's a font I wanted to love: Playfair Display. It's gorgeous at 48px. Look at those dramatic thick-thin contrasts. It feels expensive.

Playfair Display
At 14px, the thin strokes practically disappear. Users over 40 will struggle to read this.
Merriweather
At 14px, every stroke remains visible. It was literally designed for screen reading.

What I learned: A font that looks beautiful in a hero section can be completely unusable in a paragraph. Now I always test fonts at three sizes: 48px (headings), 24px (subheadings), and 14px (body text). If the 14px version looks blurry or the letters close up, I don't use it for body copy. Period.

5. The X-Height Trap

Here's a technical term that cost me a client: x-height. It's the height of lowercase letters (literally the height of the letter 'x'). Fonts with small x-heights look elegant but are harder to read on phones.

x
Cormorant Garamond
Small x-height = elegant but tiny
x
Inter
Large x-height = readable at any size

The fix: For body text, I almost always pick fonts with large x-heights. Inter, Roboto, Open Sans, Merriweather — they're popular because they're readable, not because they're trendy.

6. Dark Mode Killed My Font Choice (Twice)

I once spent hours picking the perfect font for a fintech startup. It looked crisp and professional in Light Mode. Then I switched to Dark Mode and the thin strokes completely disappeared. The letters looked like they were bleeding.

My rule now: I don't approve any font until I've tested it in both Light and Dark Mode using the theme toggle in FontPreview. If the font loses contrast on black, it's out. Most users with OLED screens will thank you.

7. You Don't Need 9 Weights

I used to load entire font families because I was afraid of "running out" of styles. This is how I ended up shipping 400kb font files for sites that only used Regular and Bold.

What I do now:

  • Headings: Bold (700) or Extra Bold (800)
  • Body text: Regular (400)
  • Emphasis: Bold (700) — same as headings
  • Captions/labels: Medium (500) or Semi-Bold (600)

That's it. I don't need Light, Extra Light, Thin, Black, or UltraBlack. Two weights cover 95% of use cases. Your users will appreciate the faster load time.

My "Stop Picking Bad Fonts" Checklist

I literally keep this open in a tab when I'm working on a new brand.

✓ Personality match: Does this font dress like the brand?
✓ 14px test: Can I read it on a phone without zooming?
✓ Dark mode test: Does it disappear or bleed on black?
✓ X-height check: Is the lowercase tall enough to be readable?
✓ Weight audit: Did I just load 9 weights or 2?
✓ Client translation: Can I explain this choice in one sentence?

I still get font choices wrong. Just last month I proposed a pairing that looked perfect on my screen and completely broke on the client's Windows laptop. It happens. The difference now is I have a system to catch it before I send the invoice.

You don't need to memorize font categories or read 50 books on typography. You just need to ask better questions before you hit "approve." This checklist took me three years and dozens of embarrassing client emails to build. Steal it.

MAK

Muhammad Afsar Khan

Afsar is a designer from Lahore who learned typography by making expensive mistakes. He built FontPreview so other designers could test fonts without downloading 50 files or guessing whether something would look good in production. He still gets nervous before client calls.

📚 More from Afsar

Still using Comic Sans? I don't judge. I've been there.