agentsclimarketplace

Shader graph best practices

Skill adevra/unity-shader-agent-skills/skills/shader-graph-best-practices

Curated agent skills for Unity shader development targeting mobile GPUs and WebGL browsers.

Install
npx -y skills add adevra/unity-shader-agent-skills --skill shader-graph-best-practices

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

  • 8 stars8 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

What its author says it does

Copied from the file, not written here

Node budgets, custom lighting, sub-graphs, precision control, and mobile workflows for Unity Shader Graph

SKILL.md

7.4 KB, as published. Nobody here has run it

Shader Graph Best Practices for Mobile Unity

TRIGGER

Use this skill when the user is working with Unity Shader Graph (the node-based visual shader editor) for URP or HDRP. Triggers include: "Shader Graph", "node-based shader", "sub-graph", "custom function node", "Shader Graph mobile", "Shader Graph optimization", "custom lighting Shader Graph", "Shader Graph precision", or any visual shader authoring workflow in Unity. Also trigger when the user references Ben Cloward, Cyanilux, or Daniel Ilett Shader Graph tutorials.

CORE RULES

  1. Keep node count under 100 for mobile targets. Each node compiles to shader instructions. Above ~100 nodes, mobile GPUs hit instruction cache limits and performance drops sharply. Use Sub Graphs to organize, but they don't reduce instruction count.

  2. Set graph-level precision to Half for mobile. In the Graph Inspector, change Precision to "Half". Override individual nodes to "Float" only for positions and UVs.

  3. Use Sub Graphs to organize, not to optimize. Sub Graphs improve readability but compile inline — they don't reduce instruction count. However, they enable reuse across graphs, which reduces total project maintenance.

  4. Custom Function nodes are the escape hatch. When Shader Graph can't express something efficiently (or uses too many nodes for a simple operation), write a Custom Function node in HLSL. This is especially useful for lighting access, complex math, and platform-specific branching.

  5. Shader Graph generates all required passes automatically (ForwardLit, ShadowCaster, DepthOnly, DepthNormals, Meta). You don't need to worry about multi-pass like in HLSL — but you also can't optimize individual passes.

CUSTOM LIGHTING IN SHADER GRAPH

Shader Graph's default Lit target uses PBR (Physically Based Rendering). For mobile, you often want simpler lighting. Use Cyanilux's custom lighting sub-graphs:

Install Custom Lighting Nodes

The Cyanilux/URP_ShaderGraphCustomLighting package adds these sub-graph nodes to Shader Graph:

  • MainLight — direction, color, shadow attenuation
  • AdditionalLights — loop over additional lights (use sparingly on mobile)
  • AmbientSH — spherical harmonics ambient
  • MainLightShadows — shadow sampling
  • Cel/Toon Shading — step-based lighting

Usage Pattern

  1. Set the graph target to Unlit (not Lit) — this disables Unity's PBR lighting
  2. Add Cyanilux's MainLight sub-graph to get light direction + color
  3. Compute your own diffuse: saturate(dot(Normal, LightDirection)) * LightColor
  4. Add ambient from the AmbientSH sub-graph
  5. Multiply by your albedo texture
  6. Output to the Unlit graph's Color output

This gives you full control over lighting complexity — critical for mobile where PBR's multi-texture GGX/Smith BRDF is often too expensive.

NODE EFFICIENCY TIPS

Combine operations

BAD:  Multiply → Add → Multiply → Saturate  (4 nodes)
GOOD: Custom Function node with: saturate(a * b + c) * d  (1 node)

Use Shader Graph Variables (Cyanilux)

The ShaderGraphVariables package adds Register Variable and Get Variable nodes. This prevents recalculating the same value multiple times in complex graphs — the equivalent of a local variable in code.

Texture sampling efficiency

  • Use a single Sample Texture 2D node and split channels, rather than sampling the same texture multiple times
  • For normal maps, use the Sample Texture 2D node with Type set to Normal — it handles unpacking automatically
  • Channel-pack masks into a single texture's RGBA channels (see texture-packing-variant-stripping skill)

Avoid expensive nodes on mobile

NodeCostAlternative
Fresnel EffectMediumManual: 1 - saturate(dot(ViewDir, Normal)) then Power
VoronoiHighPre-bake to texture
Gradient NoiseHighUse Simple Noise or pre-bake to texture
TriplanarHigh (3 texture samples)Use on specific meshes only, not terrain
Normal From HeightHighUse actual normal maps instead
Custom Render TextureHighPre-bake when possible

FULL SCREEN SHADER GRAPH (UNITY 6+)

Unity 6 introduced Full Screen Shader Graph for post-processing effects. Use with URP's Full Screen Pass Renderer Feature:

  1. Create a new Shader Graph with Full Screen target
  2. The graph receives URP's camera color and depth as inputs
  3. Apply your post-processing effect (vignette, color correction, etc.)
  4. Add a Full Screen Pass Renderer Feature to your URP Renderer
  5. Assign the Full Screen Shader Graph material

Mobile consideration: Each Full Screen pass is a full-screen blit. Combine effects into a single Full Screen graph whenever possible.

SHADER GRAPH + MOBILE CHECKLIST

  • Graph-level precision set to Half
  • Position and UV nodes overridden to Float where needed
  • Total node count < 100
  • No Voronoi or Gradient Noise nodes (pre-bake instead)
  • Using Unlit target + custom lighting instead of Lit target (if lighting is simple)
  • Texture samples ≤ 4
  • No Triplanar on large surfaces
  • Sub Graphs used for organization and reuse
  • Keywords use shader_feature (not multi_compile) for toggleable features
  • Tested in Shader Graph preview at target resolution

REFERENCE RESOURCES

Repos

Tutorials

Key People

  • Ben Cloward — Former Unity Shader Graph team, now at ILM. Weekly tutorials on both Unreal and Unity Shader Graph.
  • Cyanilux — Most actively maintained URP Shader Graph repos. Custom lighting, code templates, variables.
  • Daniel Ilett — Shader Graph Basics series, author of Building Quality Shaders for Unity.
  • MinionsArt (Joyce) — "Shaderwitch", GIF-based quick shader tips, 200 tutorials.
  • Gabriel Aguiar — VFX Graph + Shader Graph tutorials (portals, water, tornado).

SOURCES

Keep looking

Skills are one crate of 328,083. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.