# Svg Precision Skill

> Generate deterministic SVGs from structured specs with validation and rendering. Use for icons, diagrams, charts, UI mockups, and technical drawings.

- Skill: `dkyazzentwatwa/svg-precision-skill` (Agent Skill, multi-file: 16 files)
- Install (CLI): `npx skillmds@latest add dkyazzentwatwa/svg-precision-skill`
- Raw SKILL.md: https://api.skillmd.com/api/skills/dkyazzentwatwa/svg-precision-skill/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: dkyazzentwatwa (https://skillmd.com/u/dkyazzentwatwa)
- Updated: 2026-09-09
- Page: https://skillmd.com/skills/dkyazzentwatwa/svg-precision-skill

---


# SVG Precision Skill

Build SVGs from explicit scene specifications, then validate before handing them off.

## Workflow

1. Translate the request into a concrete spec with fixed dimensions and coordinates.
2. Use `references/spec.md` for templates and `references/recipes.md` for stable layout patterns.
3. Build the SVG with `scripts/svg_cli.py build`.
4. Validate with `scripts/svg_cli.py validate`.
5. Render a PNG preview when the user needs a quick visual check.

## Rules

- Set `viewBox`, width, and height explicitly.
- Prefer absolute coordinates and simple shapes.
- Treat text as risky when exact rendering matters.
- Avoid exotic filters unless they are necessary and testable.