Agent skill

Shader Programming

by ukanwat in ukanwat/overtime

Write game shaders from cross-engine fundamentals — the vertex→fragment pipeline, coordinate spaces, UV math, and common 2D/3D effects (tint, UV scroll, dissolve, outline, fresnel rim, vignette) in…

Apache-2.0Auto-check passedGame Development

Install Shader Programming

skills CLI
$ npx skills add ukanwat/overtime --skill shader-programming -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install ukanwat/overtime shader-programming --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/ukanwat/overtime.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/shader-programming .claude/skills/shader-programming && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
shader-programming
GitHub stars
387
Used in
1 other repo
Token cost
~1.8k tokens
SKILL.md length
548 words
Files
2 (incl. references)
Skills in repo
21
Repo updated
First seen
Licence
Apache-2.0

At a glance

Write game shaders from cross-engine fundamentals — the vertex→fragment pipeline, coordinate spaces, UV math, and common 2D/3D effects (tint, UV scroll, dissolve, outline, fresnel rim, vignette) in…

  • Works in 4 steps: Fragment basics: sample, tint, and combine → Scrolling UVs (animated texture) —… → Dissolve (threshold a noise map, glow… → …
  • The user mentions shaders
  • SKILL.md covers When to use, Core workflow, Patterns and Pitfalls, plus 2 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Shader Programming is an agent skill from ukanwat/overtime. Write game shaders from cross-engine fundamentals — the vertex→fragment pipeline, coordinate spaces, UV math, and common 2D/3D effects (tint, UV scroll, dissolve, outline, fresnel rim, vignette) in GLSL with HLSL equivalents. Use when the user mentions shaders, fragment/pixel shader, vertex shader, UV, GLSL, HLSL, or effects like dissolve, outline, or rim light.

Its SKILL.md is about 1.8k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including reference files (for example `references/effects.md`). Compatibility notes: Concepts engine-agnostic; examples in GLSL-style (Godot gdshader / OpenGL) with HLSL (Unity/Unreal) equivalents noted. Pairs with godot-shaders.

It sits in Game Development, covering Shaders. It works with Godot. The repository describes itself as: Give a coding agent a brief, not a chat, and it works on its own across sessions. Includes an example run: an open-world city built in a real game engine with no human help. In… The licence is Apache-2.0.

When your agent uses it

  • The user mentions shaders
  • Fragment/pixel shader
  • Effects like dissolve

Example prompts

  • “/shader-programming”

Requirements

  • Compatibility (from SKILL.md): Concepts engine-agnostic; examples in GLSL-style (Godot gdshader / OpenGL) with HLSL (Unity/Unreal) equivalents noted. Pairs with godot-shaders.

Workflow steps

4 steps, taken from the step headings in SKILL.md.

  1. Fragment basics: sample, tint, and combine
  2. Scrolling UVs (animated texture) — frame-rate independent
  3. Dissolve (threshold a noise map, glow the edge)
  4. Fresnel rim light (3D) — brighten glancing angles

What it can do on your machine

Read from SKILL.md and the folder at commit fc215d4. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are glsl).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

  • Compatibility

    Concepts engine-agnostic; examples in GLSL-style (Godot gdshader / OpenGL) with HLSL (Unity/Unreal) equivalents noted. Pairs with godot-shaders.

    From compatibility in the SKILL.md frontmatter.

Context cost

Shader Programming loads about 1.8k tokens when it runs, and up to ~3k if it reads all its reference files. Until then it costs about 96 tokens; SKILL.md has 548 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~96
When it runs · the whole SKILL.md, loaded when a task matches
~1.8k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from ukanwat/overtime at commit fc215d4, republished under its Apache-2.0 licence (© ukanwat). 548 words, ~1,762 tokens.

Download SKILL.mdSave it as .claude/skills/shader-programming/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
shader-programming
description
Write game shaders from cross-engine fundamentals — the vertex→fragment pipeline, coordinate spaces, UV math, and common 2D/3D effects (tint, UV scroll, dissolve, outline, fresnel rim, vignette) in GLSL with HLSL equivalents. Use when the user mentions shaders, fragment/pixel shader, vertex shader, UV, GLSL, HLSL, or effects like dissolve, outline, or rim light.
compatibility
Concepts engine-agnostic; examples in GLSL-style (Godot gdshader / OpenGL) with HLSL (Unity/Unreal) equivalents noted. Pairs with godot-shaders.
license
Apache-2.0
metadata.engine
none
metadata.category
disciplines
metadata.difficulty
advanced

Shader programming (cross-engine)

Shaders are small programs that run per vertex and per pixel on the GPU. The concepts — the pipeline, coordinate spaces, UVs, and how common effects are built — port across engines; only the language dialect and built-in variable names change. This skill teaches those portable fundamentals in GLSL with HLSL equivalents; use godot-shaders (or Unity/Unreal material docs) for the exact engine syntax and built-ins.

When to use

  • Use to understand or write vertex/fragment shaders and to reason about UVs, coordinate spaces, and the GPU pipeline.
  • Use to build common effects: tint/recolor, scrolling textures, dissolve, outlines, fresnel/rim light, vignette, color grading.
  • Use to translate a shader concept between GLSL and HLSL, or between engines.

When not to use: for an engine's exact shader language and built-ins, use godot-shaders (Godot shading language) or the engine's material docs. For full particle VFX systems, see unreal-niagara. For post-process stacks, defer to the engine's renderer settings.

Core workflow

  1. Know which stage you're in. The vertex shader transforms each vertex into clip space and passes data (UVs, normals) onward; the fragment/pixel shader runs per rasterized pixel and outputs a color. Most game effects live in the fragment stage.
  2. Track coordinate spaces. Positions move model → world → view → clip space; normals belong in world or view space. Mixing spaces is the most common bug.
  3. Drive effects with UVs and time. UVs are 0..1 texture coordinates; offset, scale, or distort them, and animate with a time uniform.
  4. Work per pixel, branch-light. Prefer mix, step, smoothstep, and clamp over if where possible; GPUs run pixels in lockstep and dislike divergent branches.
  5. Pass data via uniforms (constant per draw) and varyings (interpolated vertex→fragment). Keep texture samples few; they dominate cost.
  6. Verify visually and on target hardware. Shaders that look right on desktop can break on mobile (precision, missing features). Test where it ships.

Patterns

GLSL-style fragment snippets (close to Godot's canvas_item/spatial shaders and OpenGL). See references/effects.md for the HLSL equivalents and the full outline/fresnel/vignette shaders.

Show full SKILL.md (216 more words)Show less
1. Fragment basics: sample, tint, and combine
glsl
// Per-pixel: read the texture at this UV, multiply by a color (tint), keep alpha.
uniform sampler2D tex;
uniform vec4 tint;          // e.g. (1,0,0,1) reddens; multiply is non-destructive
in vec2 uv;                 // interpolated 0..1 texture coordinate (a "varying")
out vec4 frag;
void main() {
    vec4 c = texture(tex, uv);   // HLSL: tex.Sample(samp, uv)
    frag = c * tint;             // component-wise multiply tints without clipping
}
2. Scrolling UVs (animated texture) — frame-rate independent
glsl
// Add time * speed to the UV to scroll. fract() wraps it into 0..1 so it tiles.
uniform sampler2D tex;
uniform float time;          // seconds, supplied by the engine
uniform vec2 scroll_speed;   // UV units per second, e.g. (0.1, 0.0)
in vec2 uv;
out vec4 frag;
void main() {
    vec2 scrolled = fract(uv + scroll_speed * time);  // HLSL: frac(...)
    frag = texture(tex, scrolled);
}
// Drive with a real time uniform, not a per-frame accumulator, so speed is stable.
3. Dissolve (threshold a noise map, glow the edge)
glsl
// Hide pixels where noise < threshold; tint a thin band at the boundary.
uniform sampler2D tex;
uniform sampler2D noise_tex;     // grayscale noise, 0..1
uniform float amount;            // 0 = fully visible, 1 = fully dissolved
uniform float edge = 0.05;       // width of the glowing edge band
uniform vec4 edge_color;
in vec2 uv;
out vec4 frag;
void main() {
    vec4 c = texture(tex, uv);
    float n = texture(noise_tex, uv).r;
    if (n < amount) discard;                 // cut away dissolved pixels
    float e = smoothstep(amount, amount + edge, n);  // 0 at the edge -> 1 inside
    frag = mix(edge_color, c, e);            // HLSL: lerp(edge_color, c, e)
}
4. Fresnel rim light (3D) — brighten glancing angles
glsl
// Rim = 1 where the surface faces away from the camera (silhouette glow).
in vec3 world_normal;        // normalized, world space (from the vertex stage)
in vec3 view_dir;            // normalized, surface -> camera, world space
uniform float power = 3.0;
uniform vec3 rim_color;
out vec4 frag;
void main() {
    float f = pow(1.0 - clamp(dot(world_normal, view_dir), 0.0, 1.0), power);
    frag = vec4(rim_color * f, 1.0);   // add to lighting; f peaks at the silhouette
}
// Correctness: normal and view_dir MUST be in the same space and normalized.

Pitfalls

  • Mixing coordinate spaces (lighting a world-space normal against a view-space light) yields subtly wrong shading. Pick one space and convert everything into it.
  • Forgetting to normalize interpolated normals/directions: interpolation shortens vectors, so dot() results drift. normalize() in the fragment stage.
  • UV assumptions across engines. Some engines flip V (top-left vs bottom-left origin); a texture may appear upside-down. Know your engine's convention.
  • Heavy branching / dynamic loops stall GPUs. Prefer step/smoothstep/ mix; reserve if/discard for genuinely cheap early-outs.
  • discard defeats early-Z and can hurt performance on tiled mobile GPUs; prefer alpha blending where you can.
  • Precision on mobile: highp vs mediump matters; large UVs or time values in low precision shimmer. Use adequate precision for coordinates and time.
  • Assuming GLSL == HLSL. mix↔lerp, fract↔frac, texture()↔.Sample(), vec2↔float2, column- vs row-major matrices. See the reference mapping.

References

  • references/effects.md — full outline (2D sprite + 3D), vignette, and color grading shaders; the GLSL↔HLSL function/type mapping table; per-engine notes (Godot canvas_item/spatial, Unity ShaderLab/HLSL, Unreal material nodes).
  • godot-shaders — Godot shading language syntax, built-ins, and screen-reading.
  • unreal-niagara — GPU particle VFX (a different shader use).
  • procedural-gen — the noise that drives dissolve and procedural texturing.

© ukanwat, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 1 other file (references) in .claude/skills/shader-programming of ukanwat/overtime.

  • SKILL.md
  • references/effects.md

Open the folder on GitHubat commit fc215d4

Used in 1 other repository

We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in ukanwat/overtime, which our catalogue first saw on October 7, 2026.

Compare with similar skills

Shader Programming next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Shader Programming compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Shader Programming this skillukanwat/overtime3871 repos~1.8kAutomated safety check: PassApache-2.0
Godot UI Rich Textthedivergentai/GD-Agentic-Skills809—~3.2kAutomated safety check: PassLGPL-3.0
Shader Basicsjame581/GodotPrompter795—~3.7kAutomated safety check: PassMIT
Godot Genre Card Gamethedivergentai/GD-Agentic-Skills809—~3.1kAutomated safety check: PassLGPL-3.0
Godot Particlesthedivergentai/GD-Agentic-Skills809—~3.4kAutomated safety check: PassLGPL-3.0
Godot Shaders Basicsthedivergentai/GD-Agentic-Skills809—~3.3kAutomated safety check: PassLGPL-3.0

Similar skills

  • Godot UI Rich Text

    thedivergentai/GD-Agentic-Skills

    Expert blueprint for RichTextLabel with BBCode formatting (bold, italic, colors, images, clickable links) and custom effects.

    809 GitHub stars~3.2k tokensUpdated 28 days ago
    Game DevelopmentAuto-check passed
  • Shader Basics

    jame581/GodotPrompter

    A skill your agent uses when implementing shaders — Godot shader language, visual shaders, common visual recipes, and post-processing effects

    795 GitHub stars~3.7k tokensUpdated yesterday
    Game DevelopmentAuto-check passed
  • Godot Genre Card Game

    thedivergentai/GD-Agentic-Skills

    Expert blueprint for digital card games (CCG/Deckbuilders) including card data structures (Resource-based), deck management (draw/discard/reshuffle), turn logic, hand layout (arcing), drag-and-drop…

    809 GitHub stars~3.1k tokensUpdated 28 days ago
    Game DevelopmentAuto-check passed
  • Godot Particles

    thedivergentai/GD-Agentic-Skills

    Expert blueprint for GPU particle systems (explosions, magic effects, weather, trails) using GPUParticles2D/3D, ParticleProcessMaterial, gradients, sub-emitters, and custom shaders.

    809 GitHub stars~3.4k tokensUpdated 28 days ago
    Game DevelopmentAuto-check passed
  • Godot Shaders Basics

    thedivergentai/GD-Agentic-Skills

    Expert Godot shader patterns for batch-safe hitflash, alpha-scissor foliage/dissolve, screenspace postFX, depth reconstruction, triplanar, and instance uniforms — not first-shader tutorials.

    809 GitHub stars~3.3k tokensUpdated 28 days ago
    Game DevelopmentAuto-check passed
  • Scenario Godot Shaders

    scenario-labs/skills

    A skill your agent uses when writing or fixing Godot 4.7 shaders: .gdshader code (spatial, canvasitem, particles, sky, fog), VisualShader graphs built in code, stylized or toon water, dissolve or…

    913 GitHub stars~4.9k tokensUpdated yesterday
    Game DevelopmentAuto-check passed

More from ukanwat/overtime

All 21 skills in this repo
  • Audio Design

    ukanwat/overtime

    Implement game audio practice — bus/mixer architecture and gain in decibels, ducking (sidechain), adaptive/dynamic music via layering and re-sequencing, SFX variation, and beat synchronization.

    387 GitHub starsUsed in 1 repo~1.8k tokens
    Auto-check passed
  • Camera Systems

    ukanwat/overtime

    Build game cameras that feel good — 2D follow with a deadzone, look-ahead, smoothing, and level-bounds clamping; 3D third-person orbit with collision and first-person look; plus multi-target framing…

    387 GitHub starsUsed in 1 repo~2.2k tokens
    Auto-check passed
  • Dialogue Systems

    ukanwat/overtime

    Build branching dialogue and narrative — a node/choice graph with conditions, variables, and localization hooks — and choose between authoring tools Ink and Yarn Spinner or a custom data-driven…

    387 GitHub starsUsed in 1 repo~1.8k tokens
    Auto-check passed
  • Game AI

    ukanwat/overtime

    Design NPC and enemy decision-making with finite state machines, behavior trees, steering behaviors, and A pathfinding — engine-neutral algorithms that pair with the detected engine's navigation API.

    387 GitHub starsUsed in 1 repo~2.1k tokens
    Auto-check passed
  • Game Feel

    ukanwat/overtime

    Add "juice" and game feel that makes actions satisfying — screen shake, hit-stop/freeze frames, tweened/eased motion, squash & stretch, knockback, and layered audio-visual feedback — as…

    387 GitHub starsUsed in 1 repo~2.3k tokens
    Auto-check passed
  • Game UI UX

    ukanwat/overtime

    Design and build game UI/UX — HUDs, menus, and overlays — that survive every screen: anchor- based responsive layout, resolution/aspect scaling and safe areas, keyboard/gamepad focus navigation, a…

    387 GitHub starsUsed in 1 repo~2.2k tokens
    Auto-check passed

Works with

Questions about Shader Programming

What does Shader Programming do?

Write game shaders from cross-engine fundamentals — the vertex→fragment pipeline, coordinate spaces, UV math, and common 2D/3D effects (tint, UV scroll, dissolve, outline, fresnel rim, vignette) in…. Shader Programming is an agent skill from ukanwat/overtime. Write game shaders from cross-engine fundamentals — the vertex→fragment pipeline, coordinate spaces, UV math, and common 2D/3D effects (tint, UV scroll, dissolve, outline, fresnel rim, vignette) in GLSL with HLSL equivalents.

When should I use Shader Programming?

Shader Programming fits situations like: the user mentions shaders; fragment/pixel shader; effects like dissolve.

How do I install Shader Programming in Claude Code?

Run `npx skills add ukanwat/overtime --skill shader-programming -a claude-code`. Or copy the skill folder (.claude/skills/shader-programming in ukanwat/overtime) into .claude/skills/shader-programming in your project. Claude Code loads it when a task matches its description.

How do I install Shader Programming in Codex?

Run `npx skills add ukanwat/overtime --skill shader-programming -a codex`. Or copy the skill folder (.claude/skills/shader-programming in ukanwat/overtime) into .agents/skills/shader-programming in your project. Codex loads it when a task matches its description.

Can I use Shader Programming in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add ukanwat/overtime --skill shader-programming -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/shader-programming, .gemini/skills/shader-programming, .github/skills/shader-programming and .opencode/skills/shader-programming in your project.

What does Shader Programming need to run?

SKILL.md names no scripts, command-line tools or credentials: Shader Programming is instructions for the agent only. Compatibility (from SKILL.md): Concepts engine-agnostic; examples in GLSL-style (Godot gdshader / OpenGL) with HLSL (Unity/Unreal) equivalents noted. Pairs with godot-shaders..

Does Shader Programming access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Shader Programming safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Shader Programming use?

Shader Programming is published under the Apache-2.0 licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Shader Programming use?

About 1.8k tokens (SKILL.md is roughly 7k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.3k tokens, read only when the agent opens those files.

What are the alternatives to Shader Programming?

Skills that share tags, products or a category with Shader Programming: Godot UI Rich Text (thedivergentai/GD-Agentic-Skills, 809 stars), Shader Basics (jame581/GodotPrompter, 795 stars), Godot Genre Card Game (thedivergentai/GD-Agentic-Skills, 809 stars) and Godot Particles (thedivergentai/GD-Agentic-Skills, 809 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Shader Programming?

ukanwat (a GitHub user) maintains it in ukanwat/overtime, which has 387 GitHub stars. The repository holds 21 skills in this directory. The repository was last updated on October 6, 2026.

Source: ukanwat/overtime on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.