[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-74856":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":23,"hasPages":25,"topics":26,"createdAt":10,"pushedAt":10,"updatedAt":35,"readmeContent":36,"aiSummary":37,"trendingCount":16,"starSnapshotCount":16,"syncStatus":38,"lastSyncTime":39,"discoverSource":40},74856,"tegaki","KurtGokhan\u002Ftegaki","KurtGokhan","Handwriting animation for the web. Supports any font or text.","http:\u002F\u002Fgkurt.com\u002Ftegaki",null,"TypeScript",2793,109,9,5,0,14,145,387,42,28.12,"MIT License",false,"main",true,[27,28,29,30,31,32,33,34],"animation","calligraphy","cursive","font","handwriting","react","stroke-order","text-animation","2026-06-12 02:03:29","# Tegaki\n\n**Handwriting animation for any font**\n\nTegaki (手書き) turns any font into animated handwriting.\nNo manual path authoring. No native dependencies. Just pick a font.\n\n[![npm](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fv\u002Ftegaki)](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Ftegaki)\n[![license](https:\u002F\u002Fimg.shields.io\u002Fnpm\u002Fl\u002Ftegaki)](https:\u002F\u002Fgithub.com\u002FKurtGokhan\u002Ftegaki\u002Fblob\u002Fmain\u002FLICENSE)\n\n\u003Cbr clear=\"both\" \u002F>\n\n\u003Cp align=\"center\">\n  \u003Cimg src=\"media\u002Fhello-world.svg\" alt=\"Hello World handwriting animation\" width=\"500\" \u002F>\n\u003C\u002Fp>\n\n---\n\n## Quick Start\n\n**1. Install**\n\n```bash\nnpm install tegaki\n```\n\n**2. Use** (React example)\n\n```tsx\nimport { TegakiRenderer } from 'tegaki';\nimport caveat from 'tegaki\u002Ffonts\u002Fcaveat';\n\nfunction App() {\n  return (\n    \u003CTegakiRenderer font={caveat} style={{ fontSize: '48px' }}>\n      Hello World\n    \u003C\u002FTegakiRenderer>\n  );\n}\n```\n\nThat's it. The text draws itself stroke by stroke with natural timing.\n\n## Framework Support\n\nTegaki works with all major frameworks:\n\n```tsx\nimport { TegakiRenderer } from 'tegaki\u002Freact';   \u002F\u002F React\nimport { TegakiRenderer } from 'tegaki\u002Fsvelte';  \u002F\u002F Svelte\nimport { TegakiRenderer } from 'tegaki\u002Fvue';     \u002F\u002F Vue\nimport { TegakiRenderer } from 'tegaki\u002Fsolid';   \u002F\u002F SolidJS\n```\n\n```astro\n---\nimport TegakiRenderer from 'tegaki\u002Fastro';       \u002F\u002F Astro\n---\n```\n\n```ts\nimport { TegakiEngine } from 'tegaki\u002Fcore';      \u002F\u002F Vanilla JS\nimport { registerTegakiElement } from 'tegaki\u002Fwc'; \u002F\u002F Web Components\n```\n\n## Built-in Fonts\n\nSeveral handwriting fonts are bundled and ready to use:\n\n- **Caveat** — `tegaki\u002Ffonts\u002Fcaveat` _(Latin)_\n- **Italianno** — `tegaki\u002Ffonts\u002Fitalianno` _(Latin)_\n- **Tangerine** — `tegaki\u002Ffonts\u002Ftangerine` _(Latin)_\n- **Parisienne** — `tegaki\u002Ffonts\u002Fparisienne` _(Latin)_\n- **Suez One** — `tegaki\u002Ffonts\u002Fsuez-one` _(Hebrew + Latin)_\n- **Amiri** — `tegaki\u002Ffonts\u002Famiri` _(Arabic + Latin)_\n- **Tillana** — `tegaki\u002Ffonts\u002Ftillana` _(Devanagari + Latin)_\n- **Klee One** — `tegaki\u002Ffonts\u002Fklee-one` _(Japanese: kana + Kyōiku grade 1–2 kanji + Latin)_\n\nFor other fonts, use the [interactive generator](https:\u002F\u002Fgkurt.com\u002Ftegaki\u002Fgenerator\u002F) to create a custom bundle.\n\n## Documentation\n\nVisit **[gkurt.com\u002Ftegaki](https:\u002F\u002Fgkurt.com\u002Ftegaki)** for full documentation:\n\n- [Getting Started](https:\u002F\u002Fgkurt.com\u002Ftegaki\u002Fgetting-started\u002F)\n- [Framework Guides](https:\u002F\u002Fgkurt.com\u002Ftegaki\u002Fframeworks\u002Freact\u002F) (React, Svelte, Vue, SolidJS, Astro, Web Components, Vanilla)\n- [Generating Fonts](https:\u002F\u002Fgkurt.com\u002Ftegaki\u002Fguides\u002Fgenerating\u002F)\n- [API Reference](https:\u002F\u002Fgkurt.com\u002Ftegaki\u002Fapi\u002Frenderer\u002F)\n\n## Integrations\n\n- [Sli.dev](https:\u002F\u002Fsli.dev\u002F) - Create presentations using markdown. [See Tegaki integration example](https:\u002F\u002Fandreas-taranetz.github.io\u002Fslidev-addon-animated-text\u002F)\n- [Remotion](https:\u002F\u002Fwww.remotion.dev\u002F) - Create videos programmatically with React. [See Tegaki integration example](https:\u002F\u002Fgithub.com\u002FKurtGokhan\u002Ftegaki\u002Fblob\u002Fgokhan\u002Fsupport-font-features\u002Fexamples\u002Fremotion\u002Fsrc\u002FRoot.tsx)\n\n## License\n\n[MIT](LICENSE)\n","Tegaki 是一个用于网页的手写动画库，支持任何字体或文本。其核心功能是将选定的字体转换为手写动画效果，无需手动路径绘制和原生依赖，仅需选择字体即可实现自然流畅的笔画顺序动画。该库使用 TypeScript 编写，具有良好的框架兼容性，支持 React、Svelte、Vue 等主流前端框架，并且内置了多种手写字体供直接使用。Tegaki 适用于需要增强文本展示视觉效果的场景，如在线教育平台中的书写演示、个人博客或网站上的创意文字展示等。",2,"2026-06-11 03:51:09","high_star"]