Why I built fontgenerator.design: A clean Unicode reference for developers (Show HN 200+ points)
Source: Dev.to

The Problem
Usually, if you need a specific symbol like ≌ (All Equal To), you have to search through fragmented sites or messy Wikipedia tables. You might find the symbol, but not the CSS escape code or the JavaScript string you actually need for your code.
The Solution: One Page, All Encodings
I designed this tool to give every symbol its own clean, detailed page. For example, on our Unicode Symbols index, you get:
- One‑click Copy: Quick buttons for everything.
- Developer Info: HTML entities, CSS codes, JS strings, and even UTF‑8/16 bytes.
- Usage Context: How to use it on different OS and professional software (Word, Excel, etc.).
- Massive Library: Over 3,431 symbols categorized by Math, Tech, UI, and more.
Our Tech Stack
To keep it fast and type‑safe, we used:
- Framework: Next.js (^16.0.7) with App Router.
- UI: React (^19.1.1).
- Language: TypeScript (^5.9.2).
- Styling: Tailwind CSS (^3.4.17) for that clean, “brutalist” look.
Wait, Who Wrote the Code? 🤖
Here is the fun part: I didn’t write a single line of this code manually.
I am a Product Manager, and while I understand how things work, I built this entire project using “Vibe Coding” (mostly natural‑language prompts and AI collaboration). It’s amazing how modern tools allow someone with a PM background to translate a vision into a production‑ready tool that actually survived the Hacker News front page.
Improved by Community Feedback
Thanks to initial feedback, I’ve already added:
- Improved Search (supports
U+XXXXand fuzzy names). - Fixed Mobile UI (bigger tap targets for symbols).
- Added Font Tips for when symbols show up as “Tofu” boxes (□).
I’m still a “code‑newbie” PM, so I’d love to hear from the experts here. What other features or symbols would make your life easier when dealing with Unicode?
If you’re interested in my Vibe Coding workflow, let me know in the comments and I’ll write a detailed post about it!
Check it out here: fontgenerator.design/symbols