# shadertoy

Скилл помогает писать фрагментные шейдеры GLSL ES для Shadertoy и WebGL. Пригодится при создании процедурной графики, рей-маршинга и визуальных эффектов.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 1500 установок · ★ 52
- Автор: bfollington
- Лицензия: CC-BY-SA-4.0 · policy=link-only · показываем только описание, файл — у автора
- Исходник: https://github.com/bfollington/terma/tree/HEAD/plugins/tsal/skills/shadertoy/SKILL.md
- Обновлён: 2026-08-30
- HTML: https://affpapa.org/nevibecode/skills/shadertoy

## Что делает

Скилл содержит справочник по синтаксису GLSL ES и переменным окружения Shadertoy: `iResolution`, `iTime` и каналам текстур `iChannel0`–`iChannel3`. Вся логика строится вокруг функции `mainImage`, где рассчитывается нормализованный цвет пикселя.

В набор включены готовые математические паттерны: косинусные палитры градиентов, 2D-хэширование для шума и рей-маршинг с расчётом нормалей. Есть шаблоны для многопроходного рендеринга через связку буферов с накоплением кадров.

Шейдер упадёт при сборке в браузере, если нарушить правила GLSL ES: суффикс `f` у чисел не допускается, функцию `saturate()` надо менять на `clamp()`, а под `sqrt` и `pow` нельзя передавать отрицательные числа.

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add bfollington/terma --skill shadertoy -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/shadertoy/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/shadertoy/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add bfollington/terma --skill shadertoy -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/shadertoy/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add bfollington/terma --skill shadertoy -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/shadertoy/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install bfollington/terma shadertoy
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/shadertoy/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add bfollington/terma --skill shadertoy -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/bfollington/terma --path plugins/tsal/skills/shadertoy
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/shadertoy/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add bfollington/terma --skill shadertoy -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/bfollington/terma/tree/HEAD/plugins/tsal/skills/shadertoy/SKILL.md

## Когда брать
- написать базовую функцию `mainImage` с центрированными координатами
- реализовать рей-маршинг для трёхмерных процедурных сцен
- создать процедурные палитры и генераторы шума на GLSL
- настроить обратную связь через буферы рендеринга
- исправить несовместимый с WebGL синтаксис шейдеров

## Примеры запросов агенту
- Напиши шейдер для Shadertoy с вращающимся 3D-тором методом рей-маршинга.
- Сделай процедурный градиент через косинусную палитру и добавь виньетку.
- Настрой многопроходный рендеринг с буфером для эффекта размытия движения.

## Похожие
- [shader-dev](https://affpapa.org/nevibecode/skills/minimax-ai-shader-dev.md) — скилл · 2500 установок
- [threejs-shaders](https://affpapa.org/nevibecode/skills/threejs-shaders.md) — скилл · 15600 установок
- [pixijs-custom-rendering](https://affpapa.org/nevibecode/skills/pixijs-custom-rendering.md) — скилл · 5700 установок
- [shader-glsl](https://affpapa.org/nevibecode/skills/shader-glsl.md) — скилл · 1400 установок
- [threejs](https://affpapa.org/nevibecode/skills/mrgoonie-threejs.md) — скилл · 1200 установок
- [webgl](https://affpapa.org/nevibecode/skills/webgl.md) — скилл · 555 установок

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md