Chinese stroke order animator. Watch any Hanzi draw stroke-by-stroke in SVG animation. Powered by hanzi-writer + 9000+ character data. Essential for learners + calligraphers.
Chinese Stroke Order Animator (汉字笔顺动画)
How to use
Enter a Chinese character
Simplified or traditional, one character at a time.
Watch the auto-animation
Strokes draw in canonical order with red highlighting. Note start and end positions of each stroke.
Step or restart
Click "Next stroke" to step through manually. Click "Restart" to replay from beginning.
Adjust speed and size
Sliders for live-adjustment of animation speed and character size.
Hanzi Stroke Order: The Invisible Rules of Correct Writing
Stroke order (笔顺) is the invisible rule system that governs Chinese character writing. The same character written in different stroke orders produces visibly different shapes — character balance, line spacing, and legibility all depend on correct stroke order. Primary education in Mainland China, Taiwan, and Hong Kong all treats stroke order as a core evaluation criterion (dictation tests check stroke order alongside content).
The eight foundational rules
(1) Horizontal before vertical (十); (2) Left-falling before right-falling (人); (3) Top to bottom (三); (4) Left to right (明); (5) Outside before inside (月); (6) Center before flanks (小); (7) Inside before sealing (国); (8) Enclosure: outside frame then inside content (田). These rules apply ~95% of the time, with a few documented exceptions.
Why stroke order matters
(1) Visual balance: stroke order directly affects character symmetry. (2) Writing speed: correct order is the foundation of "flowing handwriting". (3) Dictionary lookup: Chinese dictionaries traditionally sort by radical + stroke count. (4) Handwriting recognition: smart IMEs (Pleco OCR, Apple Pencil Chinese input) all rely on stroke-order matching. (5) Calligraphy: brush calligraphy enforces stroke order strictly.
Data source
This tool uses ARPHIC (Wenkai) stroke order data (free for commercial use), covering 9,000+ commonly-used characters. Stroke directions strictly follow the PRC Ministry of Education standard; some traditional characters follow Taiwan MoE standards. Generally consistent with authoritative textbooks.
Built on hanzi-writer open-source library (MIT licence) + ARPHIC public character data. All animation rendered in your browser.
10 Facts about Stroke Order
The "永" (yǒng) Eight Methods is foundational to Chinese calligraphy. The single character 永 contains all 8 basic stroke types (dot, horizontal, vertical, left-falling, right-falling, rising, hook, turning). This is why many textbooks start stroke-order instruction with 永.
"Horizontal before vertical" is the most basic rule. 十, 土, 干 all follow it. But there are exceptions — characters like 上 do vertical first because the vertical is longer.
PRC and Taiwan stroke-order standards differ slightly. For example, 火 in PRC = dot/left-falling/dot/right-falling; Taiwan = dot/left-falling/left-falling/right-falling. This tool uses PRC standard.
Smart handwriting IMEs (iOS, Android, macOS, Sogou) achieve 95%+ accuracy thanks to stroke-order databases. Writing in the canonical order makes IME recognition significantly faster.
ARPHIC (Wenkai) is one of the world's largest open-source Chinese character databases, free for commercial use, covering 9,000+ characters with stroke-order data. Originally contributed by Taiwan's Wenkai font company in the 1990s.
Simplified characters have simpler stroke orders than traditional. For characters of the same meaning (e.g. 龙/龍), simplified versions have fewer strokes and easier sequences — an explicit goal of the 1956 simplification.
「井」 (jǐng, "well") is the most commonly mis-ordered character. Correct: horizontal, horizontal, vertical, vertical (4 strokes). Many people write vertical-horizontal-horizontal-vertical — a famous stroke-order misconception.
The "Eight Methods of 永" originated with the Tang-dynasty calligraphy master Zhi Yong. After mastering its 8 stroke types, one can supposedly write all Chinese characters well. This is the core methodology of Chinese calligraphy teaching.
Singapore and Malaysia Chinese-language education follow PRC stroke-order conventions, matching their use of simplified characters since 1969. Penang and KL Chinese-school teachers commonly demonstrate stroke order with animation tools like this one.
Pairs with RT-CHN-025 (Stroke Count Lookup) and RT-CHN-026 (Kangxi Radical Reference) — the complete Chinese character structural analysis toolset.
Frequently Asked Questions
-
~9,000+ common characters. Based on the ARPHIC database. Full HSK 1-6 coverage, most traditional characters included. Rare characters and name-specific glyphs may be missing.
-
You'll see "Character not in dictionary". This is an ARPHIC database limit. Try a similar character with the same radicals or structure.
-
Primarily PRC standard. The ARPHIC database originated in Taiwan, but stroke-order data was adjusted to match the PRC Ministry of Education conventions. Some characters differ between regions — this tool reflects the dominant 95%+ form.
-
Yes. The speed slider ranges from 0.3x (very slow, every motion visible) to 2x (quick review). Beginners should start at 0.5-0.7x.
-
Click "Next stroke" to advance one stroke at a time. The animation pauses after each stroke until you click again. Ideal for detailed teaching or calligraphy practice — watch one stroke, then mimic it.
-
Yes. SVG rendering works in all modern browsers (iOS Safari, Chrome Android, Edge). Landscape orientation recommended for a larger canvas.
-
Yes. SVG rendering stays sharp at any zoom. For higher quality, right-click the SVG and "Save As" — the most professional export method.
-
Each character's stroke data is loaded on-demand (~5-15KB per character). This avoids loading all 9,000 characters at once. First lookup is slower, but the browser caches subsequent ones.
-
ARPHIC Public License character data (free for commercial use) + hanzi-writer open-source library (MIT licence). Fully open-source, reproducible, no copyright issues.
-
Yes. Use browser print. For a complete stroke diagram, use step mode to capture each stage individually, or a browser screenshot extension for batch saves.
Method & sources
How it computes
Each character is drawn from a stroke-path file loaded on demand: every stroke is stored as an SVG path with its median line, and the animation traces those medians in the canonical order. Nothing is computed — the order shown is the order recorded in the data — and the files are served from this site rather than a CDN.
What this tool implements
- Stroke paths and stroke order come from the Hanzi Writer character data, which derives from the Make Me A Hanzi project.
- The order shown is the one recorded in that data. Stroke order is not fully uniform across the Chinese-speaking world — mainland, Taiwan and Japan differ on particular characters — so this is a widely-taught order rather than the only correct one.
- Character data is served from this domain, not from a public CDN, so using the tool sends no request to a third party.
- A character with no data file simply returns nothing rather than an invented animation.
Sources
- Hanzi Writer character data v2.0.1: https://github.com/chanind/hanzi-writer-data — the stroke paths and medians this tool animates.
- Make Me A Hanzi: https://github.com/skishore/makemeahanzi — the project that extracted the stroke data from font outlines.
- The data ultimately derives from fonts released by Arphic Technology Co., Ltd. (Taipei) in 1999 under the Arphic Public License. That licence is copyleft-shaped: it permits redistribution and modification provided recipients are given the same rights, and the full text ships with the data as ARPHICPL.TXT. Free stroke-order animation on the web rests on that 1999 decision.
What can make this go out of date
- The character data is vendored at v2.0.1 and nothing refetches it. Corrections to a stroke order upstream reach this page only when the vendored copy is updated.
- The Arphic Public License travels with the data. Any future change to how these files are served has to keep the licence text with them.
Pick up where you left off
Stored only in this browser — never sent to our servers.