What problem does it solve?
This Skill helps you quickly create consistent, readable pixel-art SVG illustrations for documentation without manually designing graphics pixel-by-pixel.
Core Features & Use Cases
- Pixel-Grid SVG Generation: Produces SVG pixel art using a fixed 7px grid with rect-based “pixels” for clean, scalable output.
- Scene & Character Layout Options: Supports dialogue/hero-style compositions (two characters with chat bubbles and arrows), single character portraits with labels, and group scenes.
- Brandable, Palette-Constrained Styling: Applies a structured color palette (skin/eyes/hair/clothes) with simple 3–5 colors per character and configurable brand clothing colors.
- Reusable SVG Structure: Outputs an SVG template with the expected <svg>, optional <defs>, grouped character placement via transforms, and proper viewBox sizing to avoid wasted space.
Quick Start
Use the pixel-art skill to generate an SVG hero illustration for a README by drawing two characters having a short back-and-forth chat with speech bubbles, arrows indicating dialogue, and a brand-colored outfit.