_/_MIT_(Code)-yellow.svg){kind=icon}
- Man（Manzu）：
1m~9m - Pin（Pinzu）：
1p~9p - Sou（Souzu）：
1s~9s - Zi（Zihai）：
1z~9z(Sorted by Fonpai - Sangenpai)1z：Higashi, East2z：Minami, South3z：Nishi, West4z：Kita, North5z：Haku, Shiro6z：Hatsu7z：Chun, Naka
- Dice:
1.~6. - Aka-Dora：Follow by a asterisk (
*). E.g.,5p*,5s*,5m*. - Fuuro：Follow by a minus sign (
-). E.g.,3m3m3m-,4s5s-6s.- Chi：
4s5s-6s - Pon：
3m3m3m- - Dai-Minkan：
6m6m6m-6m
- Chi：
- Ka-Kan：Follow by an equal mark (
=). E.g.,3m3m3m-3m=,6m. - An-Kan：Use
0p,0s,0m,0zto show the reversed one.
- 萬子（マンズ）：
1m~9m - 筒子（ピンズ）：
1p~9p - 索子（ソーズ）：
1s~9s - 字牌（ジハイ）：
1z~9z（風牌 - 三元牌順）1z：東2z：南3z：西4z：北5z：白6z：発7z：中
- サイコロ：
1.~6. - 赤ドラ：後ろに星マーク（
*）を付ける。例：5p*,5s*,5m*. - 副露（フーロ）：後ろにマイナスマーク（
-）を付ける。例：- 吃（チー）：
4s5s-6s - 碰（ポン）：
3m3m3m- - 大明槓（ダイミンカン）：
6m6m6m-6m
- 吃（チー）：
- 加槓（カカン）：後ろにイコールマーク（
=）を付ける。例：3m3m3m-3m=. - 暗槓（アンカン）：
0p,0s,0m,0z牌を裏返し表記。
- 萬子：
1m~9m - 筒子：
1p~9p - 索子：
1s~9s - 字牌：
1z~9z（按照風牌 - 三元牌順）1z：東2z：南3z：西4z：北5z：白6z：発7z：中
- 骰子：
1.~6. - 赤寶牌：在表記牌的後面加上星號（
*）。例：5p*,5s*,5m*. - 副露：在表記牌的後面加上減號（
-）。例：- 吃：
4s5s-6s - 碰：
3m3m3m- - 大明槓：
6m6m6m-6m
- 吃：
- 加槓：在表記牌的後面加上等號（
=）。例：3m3m3m-3m=. - 暗槓：使用
0p,0s,0m,0z表示翻過來的牌。
- Develop
pnpm install
pnpm dev
- Build
pnpm check
pnpm build
The app renders tiles as inline SVG (not as a webfont), which fixes iOS
download blanks and gives consistent cross-browser COLR/CPAL color support.
The glyph data is extracted ahead of time from the Riichi-Mahjong woff2 fonts
into src/lib/tiles-data.json, which the web app and the Image API both read.
-
Tile glyph data — extract ligatures, SVG paths, bounds and the COLR/CPAL palette from
preprocess/fonts/*.woff2intosrc/lib/tiles-data.json. Requires Python with fontTools. Re-run after changing the source fonts:pip install fonttools python3 preprocess/extract-tiles.py -
Web fonts — UI fonts are self-hosted via
@fontsourcepackages, imported directly insrc/styles/fonts.css(Vite bundles and hashes the woff2). Paper Mono (not on @fontsource) stays as a localpublic/fonts/woff2.
Put a tile string in the URL path to get an inline SVG image you can embed anywhere, shields.io-style. Missing parameters fall back to defaults.
https://mahjong.chingru.com/img/<tile>?theme=color&color=AA7942
| Parameter | Location | Type | Default | Description |
|---|---|---|---|---|
tile |
path | string |
required | Tile string (same notation). _ for a gap, e.g. 123m456p_5z. |
theme |
query | color | mono |
color |
color for colorful tiles, mono for monochrome. |
color |
query | string (hex) |
AA7942 |
Main tile color, six-digit hex without #. Only when theme=color. |
The SVG is rendered at a fixed height of 500px; width scales proportionally.
It is a vector, so you can resize it freely when embedding. For example:
Tip: take any share URL from the app and swap ?tile= for the /img/ path.
Full docs and live examples: https://mahjong.chingru.com/api
Static files served from public/ for crawlers and agents:
robots.txt— allows all crawlers, points to the sitemap.sitemap.xml— lists the page routes across all locales, with hreflang alternates.llms.txt— project and Image API overview for LLMs, following the llms.txt convention.
See Releases.
The source code is licensed under the MIT License.
The font files are licensed under the SIL Open Font License, Version 1.1.