既存のSVGアイコンをカスタムアイコンに置き換える方法

Falco · 2021 年 3 月 22 日午後 7:34

Discourse Gifs ships a custom GIF icon that you can use as an example:

discourse/discourse-gifs/blob/main/assets/gif.svg?short_path=61c0681

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
    <symbol id="discourse-gifs-gif" viewBox="0 0 1024 1024">
        <path d="M944 299H692c-4.4 0-8 3.6-8 8v406c0 4.4 3.6 8 8 8h59.2c4.4 0 8-3.6 8-8V549.9h168.2c4.4 0 8-3.6 8-8V495c0-4.4-3.6-8-8-8H759.2V364.2H944c4.4 0 8-3.6 8-8V307c0-4.4-3.6-8-8-8zm-356 1h-56c-4.4 0-8 3.6-8 8v406c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V308c0-4.4-3.6-8-8-8zM452 500.9H290.5c-4.4 0-8 3.6-8 8v43.7c0 4.4 3.6 8 8 8h94.9l-.3 8.9c-1.2 58.8-45.6 98.5-110.9 98.5c-76.2 0-123.9-59.7-123.9-156.7c0-95.8 46.8-155.2 121.5-155.2c54.8 0 93.1 26.9 108.5 75.4h76.2c-13.6-87.2-86-143.4-184.7-143.4C150 288 72 375.2 72 511.9C72 650.2 149.1 736 273 736c114.1 0 187-70.7 187-181.6v-45.5c0-4.4-3.6-8-8-8z"/>
    </symbol>
</svg>

トピック		返信	表示
Replace Discourse's default SVG icons with custom icons in a theme Developer Guides how-to , theme-guides	8	8504	2025 年 9 月 17 日
Introducing Font Awesome 5 and SVG icons Announcements new-feature	135	41886	2023 年 12 月 1 日
How to use a custom SVG like icon in the Reactions plugin? Support reactions	3	715	2023 年 6 月 2 日
Change icons globally Developer Guides how-to	26	9320	2025 年 10 月 5 日
Change the Like Icon to :+1: Theme component official , change-like-icon	6	13989	2024 年 2 月 27 日

既存のSVGアイコンをカスタムアイコンに置き換える方法

関連トピック