smooth-render

Guides creation of smooth high-resolution shader-based artwork using gradients, blur, and layered texture fields.

5|Updated May 5, 2026
One-click install
npx skills add https://github.com/ababup1192/flix_game_engine --skill smooth-render-ababup1192
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: smooth-render
Source: https://github.com/ababup1192/flix_game_engine/tree/main/agents-pack/skills/smooth-render
Command: npx skills add https://github.com/ababup1192/flix_game_engine --skill smooth-render-ababup1192

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When rendering non-pixel-art visuals (vector-style, watercolor, painterly, flat) in the Flix game engine, AI-generated images often fail in predictable ways: uniform edge softness, banding in gradients, oversaturated large surfaces, and airbrushed-looking textures. This Skill provides the concrete techniques to avoid those failures. ## Core Features & Use Cases - Edge hardness control: Use at least three edge types (crisp, medium, dissolving) via Field.Disk feather, Field.Smoothstep, and gradPolygon to convey depth and material. - Gradient and shading rules: Build non-monotonic color ramps with Shade.Gradient stops to model form shadows and reflected light instead of balloon-like two-color blends. - Texture layering and banding removal: Stack 2-3 scales of Fbm noise, add Field.Warp for directional flow, and dither gradients with ~1/255 amplitude Hash1 noise to eliminate banding. - Use Case: When asked to paint a smooth high-resolution background or large character (48+ pixels tall) with ShaderDoc, apply these rules, render via make render, inspect at 1x and 2x, and iterate at least three rounds of self-critique. ## Quick Start Use the smooth-render skill to paint a smooth high-resolution background with ShaderDoc and then critique the rendered output for banding, saturation, and edge hardness.

Frequently Asked Questions about smooth-render

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

FAQPage Schema
How do I remove banding from smooth gradients in shader art?

Banding is removed by adding low-amplitude noise, not by adding more gradient stops. Add Field.Hash1 noise scaled to about 1/255 amplitude (0.004) to the gradient input field, stopping at the minimum that hides the stripes.

How do I make smooth rendered objects look three-dimensional?

Avoid monotonic two-color blends, which look like balloons. Place Shade.Gradient stops non-monotonically so the darkest point sits just inside the shadow boundary, with reflected light brightening the rim, and shift shadow colors cool and lit colors warm.

When should I use smooth-render instead of pixel art techniques?

Use it for high-resolution, vector-style, watercolor, or flat visuals painted with ShaderDoc where pixels should not be visible. Do not use it for sprite.json, tile terrain, or dot-art backgrounds, which belong to the retro-pixel approach.

Why does my smooth render look airbrushed or flat?

A single Fbm noise layer produces uniform airbrushed surfaces. Layer two to three noise scales (large unevenness, medium material relief, fine grain) and add Field.Warp so the texture has directional flow like wood grain or strata.

What are the limitations of shader-based smooth rendering?

ShaderDoc evaluates per pixel, so cost scales with surface area, not layer count, and blur passes multiply texture reads. Unknown Field or Shade kinds silently fall back to defaults, and wide high-saturation surfaces or dithering techniques break the style.