Menu
Use when SVG files render with a distorted aspect ratio, especially vector SVG assets exported by Figma Desktop MCP.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
| name | fix-svg-aspect-ratio |
| description | Use when SVG files render with a distorted aspect ratio, especially vector SVG assets exported by Figma Desktop MCP. |
| license | MIT |
| metadata | {"author":"cssmagic"} |
Fix SVG files whose root <svg> attributes can make the artwork stretch instead of preserving its natural aspect ratio.
This skill is intentionally small and script-backed so other skills can call it as an atomic utility.
Each run needs one path:
If the path is missing or ambiguous, ask the user for it before running commands.
Normalize ~ and relative paths to absolute paths before reporting or running the script.
When given a directory, scan .svg files recursively and case-insensitively.
Modify files in place.
Output a non-interactive report every run. This is safe for atomic calls because the script never prompts for input.
Do not infer dimensions from paths, CSS, rendered output, or child elements. If a file has no valid viewBox, report it as unsupported.
For each valid SVG root with a valid viewBox, set these root <svg> attributes:
preserveAspectRatio="xMidYMid meet"width from the third viewBox numberheight from the fourth viewBox numberAlso remove display: block from the root style attribute. If the style attribute has other declarations, keep them.
Do not modify internal SVG content such as <g>, <path>, <defs>, gradients, ids, or fill values.
Set the path from the user's provided input:
target="/absolute/path/to/file-or-directory"
Run the bundled script from this skill directory:
python3 scripts/fix_svg_aspect_ratio.py "$target"
The script validates each SVG before writing, writes to a temporary file beside the source, then atomically replaces the original file.
The script outputs every SVG file grouped by result type:
Fixed - processing succeeded and the file was changed.Already Correct - the SVG already matched the expected root attributes.Unsupported - the SVG was readable but not safe to process, such as a missing or invalid viewBox.Failed - the script could not read, parse, or write the file.Example output:
- Fixed (1):
- /absolute/path/to/file-1.svg
- Already Correct (2):
- /absolute/path/to/file-2.svg
- /absolute/path/to/file-3.svg
- Unsupported (1):
- /absolute/path/to/file-4.svg: missing or invalid viewBox
- Failed (4):
- /absolute/path/to/file-5.svg: not valid UTF-8: 'utf-8' codec can't decode byte 0xff in position 0: invalid start byte
- /absolute/path/to/file-6.svg: XML parse failed: mismatched tag: line 1, column 10
- /absolute/path/to/file-7.svg: root SVG start tag was not found
- /absolute/path/to/file-8.svg: write failed: [Errno 13] Permission denied
Create and maintain English-first bilingual READMEs for GitHub projects. Use when converting a single-language README to a paired `README.md` and `README.zh.md`, adding a Chinese README beside an English default README, translating a Chinese README into the default English README, or keeping existing English and Chinese README files structurally synchronized.
Use when converting PNG images in a directory tree to lossless WebP in place with `cwebp`, preserving original file timestamps, deleting the source PNG files only after successful conversion, and reporting the processed image count.
Use when a local JetBrains IDE project was moved or renamed and its `.idea` metadata may still contain stale absolute project paths.
Use when developing AI agent skills in a local repository and needing to symlink that repository's skill directories into the global `~/.agents/skills` directory so local agents can discover and use them.
Use when writing, editing, or reviewing Markdown documents, including Agent Skills (`SKILL.md` files), that must follow strict house formatting rules.
Use when syncing a source directory to a target directory, converting PNG files to lossless WebP using `cwebp`, copying all non-PNG files unchanged, preserving the directory structure, and syncing creation and modification timestamps (if possible).