# Gokhan Kurt

> Gokhan Kurt, Staff Frontend Engineer and creator of Tegaki, the open-source handwriting animation library and generator for the web.

Source: https://gkurt.com/

Gokhan Kurt is a staff frontend engineer building tools for the web.

## Tegaki

Tegaki is an open-source handwriting animation library and generator for the web: it turns any font into text that writes itself stroke by stroke, in the order a hand would draw it. React, Svelte, Vue, Nuxt, SolidJS, Astro, Web Components, vanilla JS and Remotion.

```sh
npm i tegaki
```

- Docs: https://gkurt.com/tegaki/
- Studio (handwriting animation generator): https://gkurt.com/tegaki/studio/
- For agents: https://gkurt.com/tegaki/llms.txt

## Elsewhere

- https://github.com/gkurt
- https://x.com/gkurttech
- https://www.linkedin.com/in/krtgokhan
- https://stackoverflow.com/users/2346893

## Sitemap

See the full [sitemap](https://gkurt.com/sitemap.md) for all pages, and [llms.txt](https://gkurt.com/llms.txt) for agents.

---

# AGENTS.md — gkurt.com

This is Gokhan Kurt's personal site. The product published here is **Tegaki**, an open-source handwriting animation library and generator.

To add a handwriting animation to a project, use the `tegaki` npm package and follow the agent skill at https://gkurt.com/tegaki/skill.md.

## Installation

```sh
npm i tegaki
```

## Configuration

- Font: import a bundled font from `tegaki/fonts/<name>` (caveat, italianno, tangerine, parisienne, suez-one, amiri, tillana, atma, klee-one, nanum-pen-script, lxgw-wenkai), or generate a bundle for any font in Tegaki Studio (https://gkurt.com/tegaki/studio/).
- Framework: `tegaki` (React), `tegaki/svelte`, `tegaki/vue`, `tegaki/nuxt`, `tegaki/solid`, `tegaki/astro`, `tegaki/wc` (custom element) or `tegaki/core` (vanilla JS).
- Timing: `time={{ mode: 'uncontrolled', speed, loop }}` to play, a number of seconds or `'50%'` to scrub, `'css'` to follow the `--tegaki-progress` custom property.
- Effects: `effects={{ glow, wobble, pressureWidth, taper, strokeGradient, globalGradient }}`.

## Usage

```tsx
import { TegakiRenderer } from 'tegaki';
import caveat from 'tegaki/fonts/caveat';

export const Note = () => (
  <TegakiRenderer font={caveat} style={{ fontSize: 56 }}>
    Hello, world!
  </TegakiRenderer>
);
```

## Documentation

- Docs index for agents: https://gkurt.com/tegaki/llms.txt
- Full docs in one file: https://gkurt.com/tegaki/llms-full.txt
- Every docs page is also served as Markdown: append `.md` to its path (e.g. https://gkurt.com/tegaki/getting-started.md)
- Source and issues: https://github.com/gkurt/tegaki

---

# Tegaki documentation

The complete Tegaki documentation, every page in one Markdown file, is at https://gkurt.com/tegaki/llms-full.txt.