A Tcl/Tk desktop application and a single-file HTML/JS web app for identifying and consulting I Ching hexagrams by toggling yin and yang lines.
Web version (no install required): https://luginf.github.io/hexagrams/hexagrams.html
Project page: https://github.com/luginf/hexagrams/
wish hexagrams.tcl
Requires Tcl/Tk 8.5+ (sudo apt install tk on Debian/Ubuntu). For CJK characters in the trigram panel: sudo apt install fonts-noto-cjk.
Open hexagrams.html in any modern browser — no server, no build step, works offline. Or visit https://luginf.github.io/hexagrams/hexagrams.html.
- Six lines — left-click to toggle yang (solid) / yin (broken)
- Right-click (desktop) to mark a changing line: ○ on yang (old yang), × on yin (old yin)
- Mutation mode button (○ ×) — below the hexagram number, toggled by click:
- When active, clicking a line toggles its mutation marker instead of its yin/yang state
- Designed for touchscreens where right-click is unavailable
- Show/hide via ☰ → Bouton de mutation / Mutation button / 变爻按钮
- Real-time hexagram identification (King Wen sequence, 1-64)
- Left panel with the hexagram's title, keywords and description
- Right trigram panel showing, for each of the two trigrams:
- Unicode trigram symbol (☰ … ☷)
- Chinese character (乾 坤 震 …)
- Pinyin name with tones (Qián, Kūn, Zhèn …)
- Translation in the active language
- Random coin toss — hamburger menu → Aléatoire / Random / 随机:
- Clears the hexagram (lines show as faint dotted placeholders)
- Reveals a coin-toss panel below the info text
- Each click of Lancer / Toss / 掷 rolls 3 coins and fills the next line from the bottom up
- Pile / tails = 2, face / heads = 3 (traditional method)
- Sum 6 = old yin ×, 7 = young yang, 8 = young yin, 9 = old yang ○
- Each toss re-seeds the random generator from the click timestamp
- Panel hides automatically after the 6th line is filled
- Mutation result panel — appears automatically when changing lines are marked:
- Shows the resulting hexagram inline to the right
- Click the hexagram label to navigate to the result
- In navigation mode (default): same mutation positions on the result point back to the origin
- In replace mode: mutated lines become current, mutations cleared
- Hexagram navigation — hamburger menu → Hexagramme:
- Cascade menu organised by lower trigram, then upper trigram
- Each entry shows the hexagram title
- Go to number — hamburger menu → Par numéro…:
- Modal dialog with a slider (1–64) and a spinbox, kept in sync
- About dialog — hamburger menu → À propos… / About… / 关于…:
- Brief description and link to the project page
- Four themes — light, dark, sepia (default), green
- Three languages — French, English and Chinese (简体中文)
- Hamburger menu ☰ (top right) — navigation, display toggles, language, theme, reset
- Toggle trigram panel, info panel and mutation button visibility independently
- Persistent preferences (Tcl: hexagrams.ini; web: localStorage)
- Web only — responsive layout: stacks vertically (description → hexagram → mutation) on narrow screens
hexagrams/
├── hexagrams.tcl main Tcl/Tk application (single file)
├── hexagrams.html standalone HTML/JS/CSS web app (single file, no server needed)
├── hexagrams.ini persisted Tcl/Tk preferences (auto-created on first run)
├── hexagrams.fr.creole hexagram descriptions in French
├── hexagrams.creole hexagram descriptions in English
├── hexagrams.zh.creole hexagram descriptions in Chinese (simplified)
├── README.creole this file
├── CLAUDE.md developer notes (architecture, theme keys)
└── .claude/skills/
└── run-hexagrams.md launch & verification checklistPreferences are stored automatically in hexagrams.ini next to the script:
theme=sepia lang=fr show_trigrams=1 show_info=1 mut_nav_mode=1 show_mut_btn=1
Alternatively, two variables near the top of hexagrams.tcl set the compiled-in defaults (used only if hexagrams.ini does not exist):
set lang "fr" ;# "fr", "en" or "zh" set ::current_theme "sepia" ;# "light", "dark", "sepia" or "green"
Preferences are stored in localStorage under the following keys:
| Key | Value |
| yi_theme | light, dark, sepia or green |
| yi_lang | fr, en or zh |
| yi_st | 1 = trigrams visible |
| yi_si | 1 = info panel visible |
| yi_mn | 1 = mutation navigation mode |
| yi_smb | 1 = mutation button visible |
Hexagram descriptions follow a simple creole markup:
== 1. ䷀ == **Creativity, Heaven, Initiative** //Creative force of heaven, absolute and active beginning.//
- == N. … == — title (displayed at top of info panel, bold and coloured)
- **…** — bold keywords
- //…// — italic description
A changing line (爻变, yáo biàn) marks a line that transforms into its opposite, producing a second (resulting) hexagram.
- Right-click any line (desktop, both Tcl and web)
- Mutation mode button (○ ×) — click the button to enter mutation mode, then left-click / tap any line to toggle its marker. Click the button again to exit. Show or hide this button via ☰ → Bouton de mutation.
Markers:
- ○ (old yang, 老阳) — solid line that will become yin
- × (old yin, 老阴) — broken line that will become yang
When at least one line is marked, the mutation result panel appears to the right of the main hexagram, showing the result with no markers.
Clicking the result hexagram label navigates to it and keeps the same mutation positions active, so clicking again navigates back to the origin. Toggle this behaviour via ☰ → Mutation ↔ naviguer.
When Mutation ↔ naviguer is unchecked, clicking the result applies the mutation in place: the mutated lines become the current lines and all mutation markers are cleared.
Mutation markers are always cleared by Reset.
☰ → Aléatoire clears all six lines (shown as faint dotted placeholders) and reveals a coin panel below the info text.
Each click of the Lancer button simulates three coin tosses using the traditional Yi Jing method: pile (tails) = 2, face (heads) = 3. The three values are summed:
| Sum | Line type | Marker |
| 6 | Old yin (老阴) | × |
| 7 | Young yang (少阳) | — |
| 8 | Young yin (少阴) | — |
| 9 | Old yang (老阳) | ○ |
Lines fill from the bottom up (line 1 first). The random generator is re-seeded at each click (Tcl: microsecond clock; web: custom xorshift32 seeded from performance.now() + Date.now()). After the sixth line is filled, the panel hides automatically and the completed hexagram (with any mutation markers) remains displayed.
Reset hides the coin panel immediately.
☰ → Hexagramme opens a cascade menu organised by lower trigram (lines 1-3), then upper trigram (lines 4-6). Each inner entry shows the hexagram number and title. Selecting one navigates directly to that hexagram and clears all mutations.
☰ → Par numéro… opens a modal dialog with a horizontal slider (1-64) and a spinbox that stay synchronised. Press OK or Enter to navigate to the chosen hexagram.
In hexagrams.tcl, add a new entry to ::themes with all eleven colour keys, then append the name to the theme submenu loop:
set ::themes(mytheme) {
bg #... bg_left #... fg #...
fg2 #... sep #... line #...
tri_bg #... tri_border #... accent #...
btn_bg #... btn_fg #...
}
foreach th {light dark sepia green mytheme} { ... }In hexagrams.html, add a matching entry to the THEMES object and a body[data-theme="mytheme"] CSS block with the same eleven custom properties.
Each hexagram is identified by two trigrams (lower: lines 1-3, upper: lines 4-6). The trigram value is computed as l1 + l2×2 + l3×4 (yang = 1, bottom to top), giving a number 0-7. The 64-entry lookup table is indexed by upper×8 + lower.
| Value | Trigram | Symbol | Pinyin |
| 0 | Kun | ☷ | Kūn |
| 1 | Zhen | ☳ | Zhèn |
| 2 | Kan | ☵ | Kǎn |
| 3 | Dui | ☱ | Duì |
| 4 | Gen | ☶ | Gèn |
| 5 | Li | ☲ | Lí |
| 6 | Xun | ☴ | Xùn |
| 7 | Qian | ☰ | Qián |
See LICENSE.