# 汉字笔顺拆解器

把汉字拆解为笔画序列与偏旁部首结构，并渲染带组件着色的 SVG 笔顺演示。

> 标准页面: https://elysiatools.com/zh/tools/chinese-stroke-order-decomposition

- **分类:** Education

- **关键词:** 汉字, 笔顺, 部首, 拆字, 书法, 日文汉字, 韩文汉字, 语言学习

## 概述

输入一个或多个汉字，工具把每个字拆成书写顺序与偏旁/组件结构，再渲染 SVG 笔顺演示。笔画路径数据来自 Make Me A Hanzi / HanziWriter（约 9,500 常用字）；每个笔画按顺序编号绘制，部首笔画以不同颜色高亮。同时展示部首名称/编号、拼音、英文释义与 IDS 拆字（如 ⿰扌戈）。这是汉字书写学习辅助工具。

## 输入项

- **汉字** (text): e.g. 你好 / 我 / 学

## 适用场景

- 学习单个汉字的正确书写顺序和笔画数量。
- 对比多个汉字的偏旁部首与组件结构。
- 制作汉字学习材料，查看笔顺图、拼音和英文释义。

## 工作原理

- 在汉字输入框中填写一个或多个汉字，例如“你好”或“学”。
- 工具根据汉字笔画路径数据拆分每个字的书写顺序与组件结构。
- 每个笔画按顺序编号绘制，部首相关笔画使用不同颜色高亮。
- 结果以 HTML 展示笔顺网格、SVG 演示、部首信息、拼音、英文释义和 IDS 拆字。

## 使用案例

- 中文学习者通过笔画编号和部首高亮练习汉字书写。
- 教师为课堂讲解准备汉字笔顺、部首和结构示例。
- 语言学习内容创作者整理汉字的拼音、英文释义与 IDS 拆字信息。

## 常见问题

### 需要输入什么内容？

输入一个或多个汉字即可，例如“你”“我”或“你好”。

### 工具会显示哪些信息？

结果包括笔画顺序、笔画编号、部首或组件、IDS 拆字、拼音和英文释义。

### 可以一次拆解多个汉字吗？

可以。输入多个汉字后，工具会分别展示每个字的笔顺和结构。

### 部首笔画会被标记吗？

会，部首相关笔画会以不同颜色高亮显示。

### 工具输出什么格式？

工具输出 HTML 内容，其中包含 SVG 笔顺演示。

## 相关工具

- [生物量金字塔与能量流动（10% 定律）](https://elysiatools.com/zh/tools/biomass-pyramid): 按 Lindeman 能量传递定律生成营养级金字塔：输入生产者能量/生物量 E₁、传递效率（默认 10%，可调 0.1–40%）与营养级数（3–6），得到每一级的能量/生物量、占生产者百分比与每次传递的损耗（呼吸散热、排泄、未被捕食）。渲染彩色 SVG 金字塔（条宽按 √E 缩放保证可见，数值始终为真实值）与逐级数据表，并解释为何能量金字塔永远正立而数量/生物量金字塔可能倒置（如海洋生态系统）。典型实测传递效率为 5–20%。
- [CSS 渐变网格生成器（角向 + 径向混合）](https://elysiatools.com/zh/tools/css-gradient-mesh-generator): 生成 2024 年以来 Dribbble/Behance 流行的“渐变网格”：多个径向渐变（色斑 → 同色透明衰减）叠加在底色（可选角向渐变底层）上，支持混合模式、SVG 胶片颗粒、种子化布局（四角 / 环形 / 散点 / 网格），实时预览 + 可复制 CSS + Tailwind 任意值类名导出。色斑用 #RRGGBB00 八位十六进制同色衰减，避免 transparent 关键字的灰圈问题。
- [玻璃拟态 / 新拟态 CSS 片段生成器](https://elysiatools.com/zh/tools/glassmorphism-css-snippet-builder): 端到端生成磨砂玻璃（glassmorphism）或新拟态（neumorphism）的完整 CSS 片段：调节模糊、饱和度、色调不透明度、圆角、边框、外阴影与顶部高光；可选 SVG feTurbulence 颗粒噪点叠加与 @supports 不支持降级；自动附带 -webkit-backdrop-filter 前缀（Safari 18 以下必需）与 Tailwind 类映射（含 v3/v4 差异提示），并在渐变背景上实时预览成品卡片。
- [开普勒轨道求解器](https://elysiatools.com/zh/tools/kepler-orbit-solver): 数值求解开普勒方程 E − e·sin(E) = M，得到偏近点角 E、真近点角 ν、轨道半径与相对速度，支持牛顿/二分/不动点三种方法、收敛历史与 SVG 轨道图
- [SVG Sprite Sheet 生成器](https://elysiatools.com/zh/tools/svg-sprite-generator): 上传最多 30 个 SVG 图标，合并为单个 sprite sheet： 模式用于页面内联 ， 模式用于外部文件片段引用。自动补全 viewBox（由 width/height 推导）、去除重复图标、可选剥离 fill/stroke 以配合 currentColor、始终清理 与 on\* 事件属性，并生成 HTML / React / Vue / CSS 使用代码片段与每个图标的实时预览。</x-turndown>
- [SVG Favicon 生成器](https://elysiatools.com/zh/tools/svg-favicon-generator): 将 SVG 或位图 Logo 生成完整的 favicon 套件，包括 ICO、多个 PNG 尺寸、Apple Touch Icon 和 site.webmanifest
- [音频旋律轮廓提取器](https://elysiatools.com/zh/tools/audio-melody-contour-extractor): 从音频中提取主导旋律，并在一个 ZIP 中导出 MIDI、音符事件、音高轮廓、SVG 和 JSON。
- [SVG 图表逆向数据提取器](https://elysiatools.com/zh/tools/svg-chart-to-data-extractor): 从 SVG 折线图、柱状图、饼图等结构中逆向提取数据点并输出 JSON/CSV

## 示例

- [SVG示例](https://elysiatools.com/zh/samples/svg-samples): 可缩放矢量图形（SVG）示例，展示各种SVG功能和技术
- [D3.js 数据可视化示例](https://elysiatools.com/zh/samples/d3js-data-visualization): 全面的D3.js数据可视化示例，包括图表、地图、动画和交互式可视化
- [SVG 查看器样本](https://elysiatools.com/zh/samples/svg-viewer-samples): 用于浏览器内 SVG 查看器的样本矢量图
- [XML 示例](https://elysiatools.com/zh/samples/xml-samples): XML（可扩展标记语言）格式示例，从简单到复杂结构

## 相关内容

- [SVG、Favicon 与图标资产工作流工具](https://elysiatools.com/zh/hubs/svg-favicon-icon-workflows): 在一个专题中完成 favicon 套件生成、SVG 优化、ICO/PNG/JPG/WebP/SVG 之间的图标转换，以及面向网页交付的图像资产准备。
- [音频编码与格式转换工具](https://elysiatools.com/zh/hubs/audio-convert): 在一个专题里比较音频格式转换、码率调整、采样率转换、编码切换和导出工具，适合交付与归档工作流。
- [图片格式转换与动画导出工具](https://elysiatools.com/zh/hubs/image-convert): 在一个专题里比较 JPG、PNG、GIF、AVIF、WebP、TIFF、ICO、base64 以及动画导出相关的图片格式转换工具。
- [JSON 交换与格式翻译工具](https://elysiatools.com/zh/hubs/json-convert): 在一个专题里比较 JSON 与 CSV、YAML、TOML、GraphQL、XML、Markdown、Excel、BSON、EDN 等结构化格式之间的转换工具。