TL;DR

Gen Interface JP là typeface miễn phí do Yamato Iizuka tạo ra, kết hợp Inter và Noto Sans JP thành một font file duy nhất. Thay vì tự tay CSS-tweak font-size và line-height riêng cho chữ Nhật, bạn chỉ cần load 1 dòng CDN và đặt font-family. Kết quả: chữ Latin và Kanji hiển thị đồng đều về kích thước, visual weight, và spacing trên cùng một UI - không cần viết thêm một dòng CSS nào.

Vấn đề muôn thuở của UI song ngữ

Nếu bạn đang xây app với Inter - font quen thuộc của hàng triệu developer - và cần thêm tiếng Nhật, bạn sẽ gặp ngay vấn đề này: chữ số và ký tự Latin trông crisp và gọn gàng, nhưng text tiếng Nhật cạnh đó lại xuất hiện to hơn, nặng hơn, chật chội hơn.

Nguyên nhân không phải do Inter "xấu" hay Noto Sans JP "lỗi" - mà đơn giản là hai font được thiết kế với thông số khác nhau về x-height, stroke weight, và letter-spacing. Bạn có thể tự fix bằng CSS: điều chỉnh font-size, line-height, letter-spacing riêng cho selector chứa ký tự Nhật. Nhưng cách này dễ vỡ khi responsive, khó maintain, và không nhất quán ở mọi size và context.

Đây chính xác là bài toán mà Gen Interface JP sinh ra để giải quyết. Và cách nó giải quyết thú vị hơn mọi CSS hack.

Dưới nắp capô: blend font ở cấp file

Gen Interface JP không phải CSS fix - nó blend hai font ở cấp font file. Tác giả lấy glyph tiếng Nhật từ Noto Sans JP và áp dụng một bộ "tweak" trước khi merge vào Inter:

Thông sốGiá trịMục đích
Scale92.5%Thu nhỏ glyph Nhật để khớp x-height của Inter
yShift25Dịch trục Y để align baseline
Weight (wght)465Điều chỉnh độ dày nét để khớp stroke của Inter
Tracking0-0Letter-spacing nhất quán giữa hai script
palt0.00Proportional alternate width

Kết quả là một font duy nhất trong đó chữ Latin và chữ Nhật chia sẻ cùng visual weight, kích thước, và spacing. Vì điều chỉnh nằm trong font file - không phải CSS - nó hoạt động nhất quán ở mọi context: responsive layout, variable size, light/dark mode, và cả bitmap cho embedded devices.

Build pipeline của project viết bằng Python (43%) và TypeScript (33.2%), dùng công cụ ofl-font-baker để generate static font file. Font hỗ trợ convert sang bitmap 24px cho màn hình nhúng qua lv_font_conv (16-level grayscale) hoặc otf2bdf (monochrome).

Cài đặt trong 30 giây

Thêm vào <head> của trang:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gen-interface-jp@latest/400.css" />

Áp dụng trong CSS:

font-family: "Gen Interface JP", sans-serif;

Có 16 file CSS tương ứng với 16 weights (2 families x 8 weights). Dùng all.css nếu cần đủ weights, hoặc chỉ định weight cụ thể (700.css, display-400.css) để tối ưu performance. Font sử dụng subsetting kiểu Google Fonts nên tốc độ tải nhanh hơn so với single bundle file.

Ai nên thử ngay

Font phù hợp nhất cho ba nhóm:

  • Web và app developers đang dùng Inter làm font chính và cần hỗ trợ tiếng Nhật. Đây là giải pháp drop-in - không cần refactor CSS hiện tại, chỉ đổi font-family.
  • UI designers xây design system đa ngôn ngữ. 2 families (body và display) với 8 weights đủ để dựng typography scale hoàn chỉnh - từ caption nhỏ đến heading lớn.
  • Embedded engineers làm automotive dashboard, IoT devices, instrument panel. Font hỗ trợ convert sang bitmap 24px với công cụ phổ biến trong hệ sinh thái LVGL và U8g2.

Ví dụ use case từ type tester chính thức: "Driving Range 航続可能距離", "Tokyo Clear 27℃ 東京 晴れ 27℃", "Central Gate 中央改札", "Gyroscope ジャイロスコープ" - tất cả đều là những context điển hình của automotive và navigation UI.

Giới hạn cần biết

  • Font chỉ giải quyết bài toán Inter + Japanese. Nếu base font của bạn là Geist, SF Pro, hay bất kỳ font Latin nào khác, cần tìm giải pháp riêng.
  • Project còn rất mới - v0.1.2 phát hành ngày 6/5/2026, 68 GitHub stars, 2 releases. Chưa được production-test rộng rãi ở enterprise app quy mô lớn.
  • Không có roadmap công bố chính thức - chưa rõ kế hoạch thêm hỗ trợ Korean, Chinese, hay các ngôn ngữ CJK khác.

Download và nguồn tham khảo

Gen Interface JP hoàn toàn miễn phí. Font files phát hành theo SIL Open Font License 1.1, source code theo MIT License. Tác giả nhận hỗ trợ tùy chọn qua GitHub Sponsors.

Nguồn: tweet giới thiệu bởi @kgsi, gen.typesetting.jp, GitHub repo.