CHIAKI LETTERPRESS WORKS
千秋印書館
TYPE SPECIMEN · LETTERPRESS FOR THE WEB
Simulating in the digital the fibre of the paper, the weight of the ink, the lean of the type, the flaws of the impression. A project that reproduces letterpress printing on the web.
SPECIMEN OF CHINESE TYPE
活字見本
Double Pica.
千秋印書館
Double Small Pica.
常世電子活版所
Two-line Brevier.
代印中西各種書籍
Three-line Diamond.
鉛字紙墨與印工俱備
Small Pica.
本館開設以來已有五十餘年
Brevier.
承印經史子集章程契據名帖傳單
SPECIMEN OF FACES
Specimen of faces
I.Ming · 明體 · 開源自架
一點明體 千秋印書館
Rixing Song No.2 · 宋體 · justfont
日星宋體貳號 千秋印書館
Source Han Sans · 黑體 · justfont
思源黑體 千秋印書館
Lanyang Hei · 超黑 · justfont
蘭陽黑 千秋印書館
SETTING
Vertical and horizontal
Ink strength
1.0
Lean
1.0
Ink weight
1.0
Chinese, vertical
活版印刷
一顆鉛字是一塊金屬。字面朝上,排進版盤裡,一顆挨著一顆,行與行之間夾進薄薄的鉛條決定行距。
排好的版上機、著墨、壓紙。壓力落在紙上,字就陷進纖維裡,指腹摸得到那道凹痕 —— 這是活版與平版最明顯的分別。
墨不會每次都沾得一樣勻。這一顆吃飽了墨,飽滿發黑;那一顆沾得少,筆畫就虛了半邊。
鉛字會磨損。用久的字邊角崩了口,印出來缺一角,換一顆新的又太黑,同一頁上深淺不齊。
排字工的手也不是尺。每顆字擺進去都差那麼一點點,整段看下去,字是活的,行是斜的。
這些在照相排版之後都被修掉了。字距均勻、墨色一致、邊緣銳利,乾淨,但也就少了那點手的溫度。
這個套件把上面這些事寫回樣式裡:紙的纖維、墨的濃淡、字的歪斜與缺角,一層一層疊回去。
你現在讀的這段,直排與橫排是同一份內容。
Chinese, horizontal
活版印刷
一顆鉛字是一塊金屬。字面朝上,排進版盤裡,一顆挨著一顆,行與行之間夾進薄薄的鉛條決定行距。
排好的版上機、著墨、壓紙。壓力落在紙上,字就陷進纖維裡,指腹摸得到那道凹痕 —— 這是活版與平版最明顯的分別。
墨不會每次都沾得一樣勻。這一顆吃飽了墨,飽滿發黑;那一顆沾得少,筆畫就虛了半邊。
鉛字會磨損。用久的字邊角崩了口,印出來缺一角,換一顆新的又太黑,同一頁上深淺不齊。
排字工的手也不是尺。每顆字擺進去都差那麼一點點,整段看下去,字是活的,行是斜的。
這些在照相排版之後都被修掉了。字距均勻、墨色一致、邊緣銳利,乾淨,但也就少了那點手的溫度。
這個套件把上面這些事寫回樣式裡:紙的纖維、墨的濃淡、字的歪斜與缺角,一層一層疊回去。
你現在讀的這段,直排與橫排是同一份內容。
English, horizontal
On Movable Type
A sort is a small block of metal. Face up, locked into the forme, one against the next, with thin strips of lead between the lines to hold them apart.
The forme goes on the press, takes ink, and meets the paper. The pressure drives the face into the fibre, and you can feel the bite with a fingertip.
The ink never lands evenly. One letter comes up full and black, the next takes less and goes thin along one side of the stroke.
Type wears out. An old sort prints with a corner missing; a fresh one prints too dark, and the page is never quite level.
Nor is the compositor a ruler. Every piece sits a fraction off, and read as a paragraph the letters are alive and the lines lean.
Photocomposition tidied all of this away — even spacing, even colour, clean edges. Cleaner, and colder.
This package writes those accidents back in: the fibre of the paper, the weight of the ink, the lean and the chipped corner.
SET YOUR OWN
Set your own
Direction
Size
Face
Export
Leading
1.50em
Tracking
0.00em
Ink strength
1.0
Lean
1.0
Ink weight
1.0
Composition happens when you leave the box — the jitter splits every character, and doing that mid-typing breaks input methods. Drag the corner of the box to resize it.
USAGE
Usage
Without a framework
import { mount, redact } from 'kappan' const dispose = mount({ typeFamily: "'I.Ming', serif" }) document.querySelectorAll('.sg').forEach(redact)
React
import { LetterpressStyles, LetterpressFilters, Redacted } from 'kappan/react' <div className="lp"> <LetterpressStyles typeFamily="'I.Ming', serif" /> <LetterpressFilters /> <i className="lp-fibre" /><i className="lp-grain" /> {/* 豎排加 .lp-v,橫排拿掉就好 */} <p className="sg lp-v lp-typed"><Redacted text="常世通信 ███ 第一號" /></p> </div>
BEFORE YOU USE IT
Before you use it
Bring your own face — open source, a system font, or a justfont webfont subscription all work.
Vertical setting needs a separate face with vertical forms for the punctuation; most Ming faces have none.
Filtering a whole page of text is slow on Safari. With a lot of copy, keep it to the headings.
千秋稻荷社印書館 常世町一丁目
Type set in I.Ming 一點明體 · IPA Font License 1.0