dithering

What problem does it solve?

Converts images and visual content into retro 1-bit, halftone, or ASCII renderings so designers and engineers can produce nostalgic, textured visuals without manual pixel-by-pixel trial and error or uncertain implementation choices.

Core Features & Use Cases

• Multiple rendering approaches: guidance and patterns for a drop-in React ASCII library, a Canvas 2D Bayer ordered dither, error-diffusion algorithms (e.g., Floyd–Steinberg), and a React Three Fiber + GLSL shader pipeline for real-time effects.
• Algorithm and platform tradeoffs: helps choose between quick library integration, build-time static baking, CPU-based canvas processing, and GPU shaders based on interactivity, performance, and fidelity requirements.
• Practical usage: create ASCII portrait cards, bake monochrome hero images for blog headers, implement animated dithered hero backgrounds, or build shader-driven CRT/scanline post-processing for video.
• Operational notes: covers CORS for canvas, device pixel ratio considerations, palette quantization advice, and SSR/client-only rendering guardrails.

Quick Start

Use the dithering skill to convert an image into a monochrome dithered canvas or ASCII art while specifying the algorithm, output width, and whether the effect must be static or real-time.