如何编辑 youtube 的图标?

how to edit the icon of youtube?

我是网页设计领域的新手。当我在浏览器中听到检查选项时,我想将 youtube 图标更改为 mytube。然后,当我检查图标的代码时,我得到了一个很长的数据,这是我在学习期间从未见过的。我附上那个代码。有谁知道把字母y,o,u转成m,y??

<svg>
<path d="M41.4697 18.1937C40.9053 17.8127 40.5031 17.22 40.2632 16.4157C40.0257 15.6114 39.9058 14.5437 39.9058 13.2078V11.3898C39.9058 10.0422 40.0422 8.95805 40.315 8.14196C40.5878 7.32588 41.0135 6.72851 41.592 6.35457C42.1706 5.98063 42.9302 5.79248 43.871 5.79248C44.7976 5.79248 45.5384 5.98298 46.0981 6.36398C46.6555 6.74497 47.0647 7.34234 47.3234 8.15137C47.5821 8.96275 47.7115 10.0422 47.7115 11.3898V13.2078C47.7115 14.5437 47.5845 15.6161 47.3329 16.4251C47.0812 17.2365 46.672 17.8292 46.1075 18.2031C45.5431 18.5771 44.7764 18.7652 43.8098 18.7652C42.8126 18.7675 42.0342 18.5747 41.4697 18.1937ZM44.6353 16.2323C44.7905 15.8231 44.8705 15.1575 44.8705 14.2309V10.3292C44.8705 9.43077 44.7929 8.77225 44.6353 8.35833C44.4777 7.94206 44.2026 7.7351 43.8074 7.7351C43.4265 7.7351 43.156 7.94206 43.0008 8.35833C42.8432 8.77461 42.7656 9.43077 42.7656 10.3292V14.2309C42.7656 15.1575 42.8408 15.8254 42.9914 16.2323C43.1419 16.6415 43.4123 16.8461 43.8074 16.8461C44.2026 16.8461 44.4777 16.6415 44.6353 16.2323Z" class="style-scope yt-icon"></path>
</svg>

长字符串是path commands的列表。后面跟着数字的每个字母决定路径的绘制方式。您在 YouTube 中选择了字母“o”。

您可以在 Illustrator 或 InkScape 等桌面编辑器中编辑 SVG 文档或元素。对于编辑路径,我经常使用像 SvgPathEditor.

这样的在线编辑器

在下面的示例中,我复制了 YouTube 图标的代码。使用 SvgPathEditor 我放大并四舍五入所有数字以缩短刺痛。

<svg viewBox="0 0 290 200" width="300">
  <path d="M 280 31 C 276 19 267 9 254 6 C 232 0 143 0 143 0 
  C 143 0 54 0 31 6 C 19 9 9 19 6 31 C 0 54 0 100 0 100 
  C 0 100 0 146 6 169 C 9 181 19 191 31 194 C 54 200 143 200 143 200 
  C 143 200 232 200 254 194 C 267 191 276 181 280 169 
  C 286 146 286 100 286 100 C 286 100 286 54 280 31 Z" fill="#FF0000" />
  <path d="M 114 143 L 188 100 L 114 57 V 143 Z" fill="white"/>
</svg>