htn-7rikazhexde https://blog.hatena.ne.jp/htn-7rikazhexde/ 7rikazhexde’s tech log https://7rikazhexde-techlog.hatenablog.com/ SVG Inkscape Docusaurus PNG Canva SSG 備忘録 経緯 やり方 Canvaでアイコンを作成してPNGファイルを保存する Inkscapeを使用してPNGファイルからSVGファイルを保存する 補足: InkscapeのDL方法 補足: SVGファイルのサイズ指定 サイト起動例 補足: Python、Node.jsでの作成方法 補足: favicon.icoの作成方法 まとめ 経緯 Docusaurusを使用して静的サイト(SSG)を作成する際にロゴをSVGで作成する必要がありました。 アイコン自体はCanvaで作成することができますが、SVGファイルでダウンロードする場合は有料版を使用する必要があります。 有料版は便利な機能がありますが、とりあ… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2F7rikazhexde-techlog.hatenablog.com%2Fentry%2F2024%2F04%2F01%2F000500" title="CanvaとInkscapeを使用してPNGファイルからSVGファイルを作成する方法 - 7rikazhexde’s tech log" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/h/htn-7rikazhexde/20240320/20240320193511.png Hatena Blog https://hatena.blog 2024-04-01 00:05:00 rich https://7rikazhexde-techlog.hatenablog.com/entry/2024/04/01/000500 1.0 100%