←Leaderboard/Design/shader-skills
Last commit on October 18, 2026·Created on June 20, 2026

gokayfem/shader-skills

“A technical guide for writing and art-directing procedural GLSL fragment shaders”
Combined rank
#640
across all skills
In Design
#68
category rank
Stars
346
7d change unavailable
Forks
29
Watchers
5
Traction scoreGitHub stars can be faked, so popularity alone can be misleading. Traction Score looks for broader signs of recent attention, adoption, and active maintenance.
TL;DR

This skill provides the technical foundation for creating generative visuals and SDF scenes using GLSL ES 3.00 and Shadertoy mainImage. It focuses on the intersection of mathematics and aesthetics, enabling the construction of complex procedural environments through raymarching and distance-field graphics.

Technical artists can use these capabilities to implement PBR lighting, domain warping, and atmospheric effects. The skill covers the full pipeline from initial coding to debugging and optimizing shaders for terrain, volumes, and coastal water optics.

WHO IT'S FOR
Technical artists
art-directing procedural GLSL fragment shaders
Creative coders
creating generative visuals and SDF scenes
Graphics engineers
optimizing and porting GLSL shader code
WebGL developers
implementing procedural environments in WebGL2
Repository contents

1 skill file

Compatible AgentsThe repository documents support for these agents. The skills may also work with other agents that can load SKILL.md files, but they may need some setup or small changes.

Use this skill

Follow the documented setup, then try a first task.

I’m using

Claude Code plugin marketplace

Installs: The shader-skills plugin, including shader-art-coding. · Claude Code

Before you start
  • Claude Code
  • Python 3 to run the skill's scripts
  1. Run this command in a terminal to add the marketplace.

    claude plugin marketplace add gokayfem/shader-skills
  2. Then run this command in a terminal to install the plugin.

    claude plugin install shader-skills@shader-skills
skills/shader-art-coding/SKILL.md ↗ · Checked Oct 22, 2026evals/README.md ↗ · Checked Oct 22, 2026README.md ↗ · Checked Oct 22, 2026

Give it something to do.

Suggested first task

Create a simple procedural poster shader

Uses shader-art-coding

  • No existing shader is required.
  • Python 3 is required for the bundled scripts; run them from the skill's directory.
  • glslangValidator is optional for compilation during checking.
Use shader-art-coding to create a simple Shadertoy poster shader: a warm sun disc over a dark background, with centered framing and a limited palette. Start with 2D distance fields and keep the first version small. Include a debug view for the distance field, use the verified library where appropriate, then bundle and check the shader. Deliver the self-contained out.glsl and report any validation limitations.