Japanese typography in Framer
A Framer site in Japanese rarely looks as good as the same design in English. The layout has not changed, the type has not changed, and yet the page reads a little cheaper. Three things are missing, and all three can be fixed on the published site.
A line breaks in the middle of a word
Japanese has no spaces between words, so a browser breaks a line wherever it happens to run out of room: mid-name, mid-number, mid-place. A native reader will not name the reason. They will only feel that the page was not finished.
東京都の家賃は高すぎるので、来月から神奈川に引っ越します。
東京都の家賃は高すぎるので、来月から神奈川に引っ越します。
Applied once to the whole site, including body copy and CMS text. Japanese, Simplified Chinese, Traditional Chinese and Thai.
There is nowhere to type a reading
Browsers have rendered ruby text for years. What is missing is the field to type it into. A name, a place, a title, a term — you only want to put the reading above it, and there is no place to put it.
｜陰影《いんえい》と｜余白《よはく》だけ。
｜陰影《いんえい》と｜余白《よはく》だけ。
The reading is decided by whoever wrote the line. Nothing is guessed from a dictionary, so a name is never read wrong. No outside requests, and 4.6 KB added to the site.
Japanese and Latin letters run into each other
In typesetting, a quarter of an em of air sits between Japanese and Latin characters. Metal type always did this. Browsers do not. So one line — the one carrying a word in Latin letters, or a number — sits very slightly tighter than the lines around it.
KHZ ARTの映像を2026年に3本、Framerで公開しました。
KHZ ARTの映像を2026年に3本、Framerで公開しました。
What is inserted is width, not a character. Copy the text and the string comes back exactly as it was typed. 1.3 KB added to the site.
Free
GET WAEI →A portfolio built on all three
The three above will repair a site that already exists. But a page laid out from the start in the expectation that it will be read in Japanese is a different page from a repaired one. SUMI is a portfolio template built on that assumption.
Eight static pages and two CMS layouts. One type scale, one motion curve, one accent colour. Nothing decorative, nothing that moves without a reason. In English the template is unchanged — the plugins simply do nothing.
Do I have to write code?
No. Each one opens as a Framer plugin, and you press apply once. It works on the published site; the canvas looks exactly as it did.
Will it remove custom code I already have?
No. All three write only inside their own markers, and remove only that range when switched off. Anything else sharing the same slot is left alone.
Will my site get heavier?
Kumihan adds 14 KB, Rubi 4.6 KB, Waei 1.3 KB, all after compression. None of them make outside requests, and none of them collect anything about your visitors.
How does the licence key arrive?
To the email address you paid with, within 24 hours. One-time purchase, no limit on the number of sites. The key is stored only in your own browser and is never written into shared project data.
How is the template delivered?
The link appears on the screen as soon as payment goes through. Sign in to Framer and it opens as a new project on your account. If you close that screen, write to us from the address you paid with and we will send it the same day.
Do I need all three?
Line breaking alone changes how the page reads. Start with Kumihan for free, add Rubi if there are words that want a reading, and Waei if your copy carries a lot of Latin letters or numbers.
We also take on the site itself.
CONTACT →