Communityコーディング&開発github.com

noiz77/svg-to-font-skill

フォルダ内のSVGグリフファイルから、OTFデスクトップフォント、WOFF2ウェブフォント、CSSアイコンクラス、インタラクティブなHTMLプレビューページを含む、本番環境対応の完全なフォントパッケージを生成するClaude Codeスキルです。

svg-to-font-skill とは?

このスキルは、SVGファイルのコレクションを、プロフェッショナルなフォントパッケージに変換するために設計されています。開発者は、アイコンや記号のセットをSVG形式で準備し、このスキルにフォルダを指定するだけで、OTF(デスクトップ)フォント、WOFF2(ウェブ)フォント、対応するCSSアイコンクラス、そしてインタラクティブなプレビュー用HTMLページが自動生成されます。これにより、アイコンフォントの作成ワークフローが大幅に簡素化され、手動でのフォントビルドやCSSの記述が不要になります。Claude Codeと連携して動作し、フォルダ内のすべてのSVGファイルをスキャンし、それらをグリフとしてフォントに組み込みます。このスキルは、カスタムアイコンセットをウェブやデスクトップアプリケーションに統合したいフロントエンド開発者やデザイナーにとって特に有用です。生成されるフォントは、ブラウザの互換性やパフォーマンスを考慮した、本番環境で使用可能な形式で提供されます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add noiz77/svg-to-font-skill

Installed? Explore more コーディング&開発 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

svg-to-font-skill は何をしますか?

SVGグリフファイルのフォルダから、本番環境対応の完全なフォントパッケージを生成するClaude Codeスキルです。OTFデスクトップフォント、WOFF2ウェブフォント、CSSアイコンクラス、インタラクティブなHTMLプレビューページを出力します。

関連スキル