How do I install the Svg To Webp skill?

Run npx skillmds@latest add haboshi/svg-to-webp in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Svg To Webp safe to use?

This skill has not completed SkillMD's automated safety review yet. Capability flags: docs only. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Svg To Webp?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Svg To Webp free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Svg To Webp?

haboshi (@haboshi) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Svg To Webp by haboshi — Agent Skill

Name: Svg To Webp
Rating: 4.2 (5 reviews)
Author: haboshi

File contents

SVG to WebP/PNG Converter

SVG画像をWebPまたはPNG形式に変換するプラグイン。sharpによる高品質変換。

使用タイミング

SVGをWebP/PNGに変換するとき
画像を軽量化したいとき
サムネイル画像の最適化が必要なとき
Web用に画像形式を統一したいとき

クイックスタート

# 単一ファイル変換
node ${CLAUDE_PLUGIN_ROOT}/scripts/convert.js \
  --input input.svg --output output.webp

# PNG形式で出力
node ${CLAUDE_PLUGIN_ROOT}/scripts/convert.js \
  --input input.svg --output output.png --format png

# ディレクトリ一括変換
node ${CLAUDE_PLUGIN_ROOT}/scripts/convert.js \
  --input-dir ./svgs --output-dir ./webps

オプション

オプション	短縮	説明	デフォルト
`--input`	`-i`	入力SVGファイルパス	-
`--output`	`-o`	出力ファイルパス	-
`--input-dir`	-	入力ディレクトリ（一括変換）	-
`--output-dir`	-	出力ディレクトリ（一括変換）	-
`--width`	`-w`	出力幅	1920
`--height`	`-h`	出力高さ	1080
`--quality`	`-q`	品質 1-100	80
`--format`	`-f`	出力形式: webp, png	webp
`--fit`	-	リサイズ方式: contain, cover, fill, inside, outside	contain
`--background`	`-b`	背景色	transparent

背景色指定

transparent - 透明背景
white / black - 名前指定
#RGB - 短縮形 (#f00 = 赤)
#RRGGBB - 6桁16進数
#RRGGBBAA - アルファ付き

前提条件

Node.js 18+
sharp (npm install で自動インストール)

---name: svg-to-webpdescription: SVG画像をWebP/PNG形式に変換。単一ファイル・ディレクトリ一括変換対応。sharpベースの高品質変換。「SVGをWebPに変換」「画像を軽量化」「サムネイルを最適化」で発動。---# SVG to WebP/PNG ConverterSVG画像をWebPまたはPNG形式に変換するプラグイン。sharpによる高品質変換。## 使用タイミング- SVGをWebP/PNGに変換するとき- 画像を軽量化したいとき- サムネイル画像の最適化が必要なとき- Web用に画像形式を統一したいとき## クイックスタート```bash# 単一ファイル変換node ${CLAUDE_PLUGIN_ROOT}/scripts/convert.js \ --input input.svg --output output.webp# PNG形式で出力node ${CLAUDE_PLUGIN_ROOT}/scripts/convert.js \ --input input.svg --output output.png --format png# ディレクトリ一括変換node ${CLAUDE_PLUGIN_ROOT}/scripts/convert.js \ --input-dir ./svgs --output-dir ./webps```## オプション| オプション | 短縮 | 説明 | デフォルト ||-----------|------|------|-----------|| `--input` | `-i` | 入力SVGファイルパス | - || `--output` | `-o` | 出力ファイルパス | - || `--input-dir` | - | 入力ディレクトリ（一括変換） | - || `--output-dir` | - | 出力ディレクトリ（一括変換） | - || `--width` | `-w` | 出力幅 | 1920 || `--height` | `-h` | 出力高さ | 1080 || `--quality` | `-q` | 品質 1-100 | 80 || `--format` | `-f` | 出力形式: webp, png | webp || `--fit` | - | リサイズ方式: contain, cover, fill, inside, outside | contain || `--background` | `-b` | 背景色 | transparent |## 背景色指定- `transparent` - 透明背景- `white` / `black` - 名前指定- `#RGB` - 短縮形 (#f00 = 赤)- `#RRGGBB` - 6桁16進数- `#RRGGBBAA` - アルファ付き## 前提条件- Node.js 18+- sharp (npm install で自動インストール)

Frequently asked questions

Svg To Webp