shader-sdf

Provide a GLSL library of 2D/3D Signed Distance Functions and boolean operations.

27|2|Updated Apr 18, 2025
One-click install
npx skills add https://github.com/tanepiper/teskooano --skill shader-sdf
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: shader-sdf
Source: https://github.com/tanepiper/teskooano/tree/main/.cursor/skills/shader-sdf
Command: npx skills add https://github.com/tanepiper/teskooano --skill shader-sdf

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a ready-to-use library of 2D and 3D Signed Distance Functions (SDFs) in GLSL, enabling rapid creation of procedural shapes, text effects, and smooth morphing without hand-crafting geometry.

Core Features & Use Cases

  • 2D & 3D Primitives: Circle, Box, Sphere, Ring, Polygon, Star, Heart and more, with clean, reusable GLSL functions.
  • Boolean & Domain Operations: Union, Intersection, Subtraction, Smooth variants, repetition, twist, bend, onion, and round operations for complex shapes.
  • Transformations & Rendering: Translation, rotation, scaling, symmetry, and 2D/3D rendering techniques (AA, glow, outline).
  • Procedural Graphics & Raymarching: Build raymarched scenes and visual effects using a compact shader toolkit.

Quick Start

Load the shader-sdf skill into your shader project, start with a simple circle using sdCircle(p, r), and render it with a basic raymarch loop. Then combine shapes with opUnion and apply translations or rotations to create more complex visuals.

Frequently Asked Questions about shader-sdf

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

FAQPage Schema
How do I create procedural GLSL shapes using signed distance functions?▼

Signed distance functions (SDFs) provide a ready-to-use GLSL library of 2D and 3D primitives and boolean operations, enabling rapid creation of procedural shapes, text effects, and smooth morphing without hand-crafting geometry.

What boolean operations are available for combining SDF primitives in shaders?▼

The SDF library supports union, intersection, subtraction, and smooth boolean variants, along with domain operations like repetition, twist, bend, onion, and round to combine primitives into complex procedural shapes.

Can I use SDFs for raymarching in WebGL without external tooling?▼

Yes, you can build raymarched scenes and visual effects in WebGL using the included scripts and references, which provide a compact shader toolkit that satisfies rendering requirements without needing external tooling.

How do I render and transform 2D SDF primitives in GLSL?▼

You can render and transform 2D SDF primitives by applying translation, rotation, scaling, and symmetry utilities, then using built-in rendering techniques like anti-aliasing, glow, and outline to visualize the final shader.

Do I need external dependencies to use this SDF shader library?▼

No external dependencies are required. The SDF shader library operates standalone using included scripts and references to generate procedural graphics, text effects, and raymarched scenes within standard GLSL workflows.