shader-dev

Create real-time GLSL visuals with ray marching and SDF modeling.

Updated Mar 26, 2026
One-click install
npx skills add https://github.com/RemseyMailjard/superpowers --skill shader-dev-remseymailjard
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: shader-dev
Source: https://github.com/RemseyMailjard/superpowers/tree/main/.github/skills/shader-dev
Command: npx skills add https://github.com/RemseyMailjard/superpowers --skill shader-dev-remseymailjard

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Shader development workflows enable rapid creation of real-time GLSL visuals by providing a curated library of techniques such as ray marching, Signed Distance Function (SDF) modeling, fluid and particle systems, procedural generation, lighting, and post-processing, helping users avoid reinventing foundational patterns.

Core Features & Use Cases

  • A modular catalog of ShaderToy-style GLSL techniques with implementation guides and references for quick prototyping.
  • Practical workflows for real-time rendering including deterministic ray marching loops, AO, lighting models, multi-pass pipelines, and structured shader organization.
  • Suitable for education, portfolio development, and production prototyping across WebGL2 and ShaderToy ecosystems.

Quick Start

Open the shader-dev skill and start by reading the Techniques routing tables in techniques/ to assemble a basic ray-marched scene with AO and lighting.

Frequently Asked Questions about shader-dev

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create real-time GLSL visuals using ray marching and SDF modeling?

Real-time GLSL visuals using ray marching and SDF modeling are created by assembling deterministic ray-marched scenes with ambient occlusion and lighting models. This skill provides modular technique routing tables and implementation guides for rapid prototyping across WebGL2 pipelines.

What is the best way to structure a ShaderToy-style multi-pass post-processing pipeline?

ShaderToy-style multi-pass post-processing pipelines are structured using modular technique catalogs and implementation references. This skill provides practical workflows for organizing multi-pass rendering, lighting models, and procedural generation into maintainable shader components.

Does this shader development workflow support WebGL2 and ShaderToy ecosystems for portfolio demos?

This shader development workflow supports WebGL2 and ShaderToy ecosystems for portfolio demos and educational purposes. It provides curated GLSL techniques, reference materials, and production-style shader effects suitable for both artistic exploration and portfolio development.

Can I use these GLSL shader techniques for production prototyping without reinventing foundational patterns?

These GLSL shader techniques can be used for production prototyping without reinventing foundational patterns. The skill provides a curated library of SDF modeling, fluid systems, procedural generation, and post-processing techniques with structured shader organization and licensing.

How do I start building a basic ray-marched scene with ambient occlusion and lighting?

To build a basic ray-marched scene with ambient occlusion and lighting, start by reading the technique routing tables in the techniques directory. These tables help assemble deterministic ray marching loops, AO, and lighting models into a functional real-time visual.