设置 SVG 图标

Q: 设置 图标可以商用吗？

withicons-luxesettings

来自 with icons Luxe 开源图标集，矢量 SVG 可无损缩放到任意尺寸，支持在线改色、复制 React/Vue/HTML 代码。

图标 ID: withicons-luxe:settings
中文名: 设置
所属集合: with icons Luxe
集合规模: 1,000 枚
基础网格: 24px
色彩: 多色
开源协议: MIT
作者: Evergrow

下载设置图标

SVG 矢量源文件，或 PNG 按 16~512 预设与 16~1024 自定义尺寸导出，任意尺寸边缘锐利。

iOS / Android 全套尺寸 · 素材包生成器用 AI 生成类似风格的图标

PNG 由矢量源实时渲染，任意尺寸边缘锐利无锯齿；下载与预览均免费，无需注册。

设置的预览与使用场景

切换预览颜色后，下方三底色、真实界面场景与各尺寸渲染会实时跟随。

预览颜色

浅色背景

深色背景

灰底融入

在真实界面里长这样

继续按钮内 · 主操作

搜索设置…输入框 · 前缀图标

设置导航菜单 · 选中态

暂无内容空状态 · 引导提示

9:41

设置

settings-2手机桌面 · App 图标

设置withicons-luxe.design/icons/settings浏览器 · 标签页与站点图标

各尺寸下的可读性

24px

32px

48px

64px

96px

128px

复制设置图标代码

内联 SVG、React、Vue 与 CSS mask 四种主流引用方式，代码基于当前源文件生成，复制即用。

svgSVG 源码（内联 HTML）

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="#0a0b26" fill-opacity=".2" d="M10.8 3c-1.2 0-1 1.9-1.3 2.6l-.5.1l-1.4-1c-.4-.2-1-.1-1.3.2L4.4 6.8c-.9.9.5 2.1.8 2.8l-.2.5l-1.7.3c-.5.1-.8.7-.8 1.1v2.7c0 1.2 1.9 1 2.5 1.3l.2.5l-1 1.4c-.2.4-.1 1 .2 1.3l1.9 1.9c.9.9 2.1-.5 2.8-.8l.5.2l.3 1.7c.1.5.7.8 1.1.8h2.7c1.2 0 1-1.9 1.3-2.6l.5-.1l1.4 1c.4.2 1 .1 1.3-.2l1.9-1.9c.9-.9-.5-2.1-.8-2.8l.2-.5l1.7-.3c.5-.1.8-.7.8-1.1v-2.7c0-1.2-1.9-1-2.6-1.3l-.1-.5l1-1.4c.2-.4.1-1-.2-1.3l-1.9-1.9c-.9-.9-2.1.5-2.8.8l-.5-.2l-.3-1.7c-.1-.5-.7-.8-1.1-.8zm1 8.2c1.9-.6 2.9 2.4 1 3.1c-2 .7-3.1-2.5-1-3.1" class="wm-shadow"/><path fill="#7b4a12" d="m15.33 10.61l-.53-1.06c-1.22-2.49-4.74-2.53-6.28-.38c-1.15 1.62-.57 4.16.71 5.55c2.3 2.48 6.38.84 6.39-2.52c.01-.53-.06-1.11-.29-1.59m-2.07.59c-.05 1.62-1.98 2.46-3.01 1.1c0-1.66 1.97-2.42 3.01-1.1" class="wm-a"/><path fill="#e3ae47" d="M11.22 7.59c-4.78.47-4.16 7.66.58 7.32c4.89-.34 4.25-7.78-.58-7.32m-.16 2.01c2.21-.62 3.1 2.71.98 3.3c-2.21.61-3.11-2.7-.98-3.3" class="wm-a"/><path fill="#7b4a12" fill-opacity=".62" d="M14.3 8.9c.2.5.5 1.1.5 1.8c.1 2.1-1.6 3.9-3.7 3.8c-.6 0-1.5-.3-1.9-.4c3.5 2.8 8.1-2 5.1-5.2M9.9 12c-.2-1.9.5-2.6 2.4-2.4c-1.6-1.4-3.8.8-2.4 2.4" class="wm-a"/><path fill="#ffefc4" fill-opacity=".24" d="M11.1 7.8c-4.3.5-3.8 7 .6 6.7c4.5-.3 3.8-7.2-.6-6.7m-.2 1.4c2.5-.6 3.6 3.1 1.2 3.9c-2.6.8-3.7-3.2-1.2-3.9" class="wm-a"/><path fill="#ffefc4" fill-opacity=".85" d="M8.4 13.11c-.11-.51-.31-1.05-.32-1.61c-.03-2.01 1.62-3.68 3.62-3.72c.6-.01 1.17.2 1.71.32c-3.33-1.85-6.86 1.68-5.01 5.01m4.8-2.55c.17 1.61-.51 2.7-2.29 2.31v.08c1.64.73 3.16-.77 2.29-2.39" class="wm-a"/><path fill="#fff" fill-opacity=".92" d="M9 13.23c-.15-.47-.36-.98-.4-1.52c-.11-1.81 1.41-3.39 3.21-3.41c.62-.01 1.18.23 1.72.4c-2.98-2.34-6.85 1.54-4.53 4.53" class="wm-a"/><path fill="#16206e" d="M10.12 1.6c-1.23.01-.8 2.05-1.18 2.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74 5.39c-.21.22-.31.73-.2 1.01l.31.8c.11.27.66.91.67 1.11c.04.88-2.65.04-2.64 1.69l.01 2.78l.34.84c.67 1.21 1.02.84 2.19 1.19c-.64.95-1.14 1.17-.7 2.41c.11.29.24.72.47.95l1.9 1.89c.34.33.98.27 1.33.01l1.21-.88c.14-.11.36.08.48.13l.15.88c.11.65.68 1.73 1.44 1.72l2.68-.01c1.22-.01.8-2.06 1.18-2.49l.64-.26l1.48 1.02c.35.25.96.07 1.24-.21l1.84-1.86c.98-1-.95-2.56-.72-3.11c.26-.62 2.59.09 2.58-1.5l-.01-2.88l-.31-.68c-.63-1.26-1.04-.9-2.22-1.25c.65-.97 1.24-1.41.62-2.65l-.39-.71l-1.9-1.89c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.17.13-.36-.1-.47-.17l-.2-1.08l-.51-1c-.15-.29-.58-.48-.89-.48zm1.33 8c.86-.17 2.41.25 2.73 1.19c.37 1.04-.42 2.33-1.32 2.82c-1.04.56-2.84.42-3.47-.75c-.71-1.33.78-3.01 2.06-3.26" class="wm-k"/><path fill="#2039b4" d="M10.12 1.6c-1.23.01-.8 2.05-1.18 2.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74 5.39c-.33.34-.27.98-.01 1.33l.88 1.21c.09.12-.15.72-.29.75l-1.7.3c-.42.08-.74.63-.74 1.02l.01 2.68c.01 1.22 2.07.8 2.49 1.18l.26.64l-1.02 1.48c-.25.35-.07.96.21 1.24l1.86 1.84c.34.33.98.27 1.33.01l1.21-.88c.12-.09.72.15.75.29l.3 1.7c.08.42.63.74 1.02.74l2.68-.01c1.22-.01.8-2.06 1.18-2.49l.64-.26l1.48 1.02c.35.25.96.07 1.24-.21l1.84-1.86c.33-.34.27-.98.01-1.33l-.88-1.21c-.09-.12.15-.72.29-.75l1.7-.3c.42-.08.74-.63.74-1.02l-.01-2.68c-.01-1.22-2.06-.8-2.49-1.18L18.46 8l1.02-1.48c.25-.35.07-.96-.21-1.24l-1.86-1.84c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.12.09-.72-.15-.75-.29l-.3-1.7c-.08-.42-.63-.74-1.02-.74zm.93 7c3.45-.68 4.48 4.61 1 5.3c-3.45.68-4.48-4.61-1-5.3" class="wm-k"/><path fill="#0a0b26" fill-opacity=".34" d="m13.5 1.9l.2 1.7c.1 0 .2.1.3.2c0-.7 0-1.4-.5-1.9m5.6 3.3c.1.2.2.7 0 .9l-1 1.5c.1.3.2.5.3.7c.2-1 2-2 .7-3.1m-9.9 7.5l-.3-.9c-.1-.5-.1-1.3.2-1.7l.5-.7l.7-.5l.9-.3h.9l.9.3c-2.6-2.3-6.1 1.2-3.8 3.8m11.6-3.5V12c0 .4-.2 1-.7 1.1l-1.8.4l-.2.6l.3.4l.4-.7l1.7-.3c.4-.1.7-.6.7-1V9.9c0-.3-.2-.5-.4-.7M2.1 13.1c.4.5 1.3.6 2 .6c-.1-.1-.2-.2-.2-.3zm16.4 1.5c.4.8 1.1 1.5.2 2.4l-1.6 1.6c-.7.7-1.6-.1-2.2-.4l1.4 1c.8.6 3.8-2.4 3.2-3.2zM7.9 17.8l-1.5 1l-.9.1c.3.3.9.6 1.3.3l1.4-1h.4l-.1-.2zm6.4 0l-.6.3l-.3 1.7c-.2 1.1-3.2.7-3.9.7c.2.2.5.4.8.4h2.5c.4 0 .9-.3 1-.7l.3-1.7l.7-.4c-.1-.2-.3-.2-.5-.3" class="wm-k"/><path fill="#fff" fill-opacity=".075" d="M10.1 1.8c-.2 0-.6.3-.6.5L9.2 4c-.1.4-.7.5-1 .5c-.7-.5-1.7-1.6-2.5-.8L3.9 5.5c-.2.2-.3.7-.1 1l1 1.4c0 .3-.1.9-.5 1l-1.7.3c-.2 0-.4.3-.5.6c-.1.7-.4 3.4.6 3.6l1.8.3l.3.7c-.2.7-.9 1.2-1.1 1.9c0 2 4.6 1.7 5.9 1.5c3.7-.7 6.8-3.2 8.2-6.7c.5-1.1.7-2 .5-3.2l.3-.5l-.1-1.6l-.2-1.2l-1-1c-.2-.2-.7-.3-1-.1l-1.4 1c-.2.2-.7-.2-.9-.3l-.3-1.8c-.1-.4-.6-.6-1-.6zm1 6.6c3.8-.5 4.6 5.2.9 5.7c-3.8.5-4.6-5.2-.9-5.7" class="wm-k"/><path fill="#fff" fill-opacity=".42" d="M10.12 1.6c-.43 0-.82.51-.89.9l-.25 1.52c-.03.15-.56.31-.69.38l.14.11c.15-.03.71-.06.75-.29l.3-1.7c.2-1.1 3.14-.76 3.94-.72c-.21-.11-.37-.22-.62-.22zM3.8 6.81c-.06-.31-.13-.65 0-.97c.16-.39 1.96-2.19 2.35-2.34c.32-.13.65-.06.96 0c-.32-.2-.61-.35-1.01-.25c-.5.12-2.37 1.96-2.52 2.46c-.14.43 0 .75.22 1.1m12.28-3.38l-1.21.88c-.13.1-.35-.06-.47-.11l-.02.08l.62.26l1.4-.99c.25-.17.66-.13.92-.14c-.41-.2-.84-.28-1.24.02M4.7 7.99c-.12.24-.24.48-.38.69l-1.7.3c-.42.08-.74.63-.74 1.02v2.4c0 .3.09.47.22.72l.01-3.15c.07-.26.23-.5.45-.66c.53-.37 1.42-.31 2.02-.47l.25-.55c-.04-.08-.09-.21-.13-.3m14.22.76v.09l.12.06l1.56.25l.11-.04c-.54-.27-1.19-.32-1.79-.36M14 9.98l.24 1.12c.06 1.45-1.06 2.78-2.54 2.84c-.5.02-.96-.13-1.42-.24c2.54 1.49 5.21-1.18 3.72-3.72m-9.48 4.1c.03.08.17.38.09.49l-.84 1.15c-.32.43-.28.85-.06 1.31c.01-.23-.04-.64.11-.85l1.02-1.48l-.22-.58zm4.57 4.51l-.06.11l.18 1.21c.03.2.11.33.2.5l.04-.11l-.25-1.56z" class="wm-k"/><path fill="#fff" fill-opacity=".92" d="M10.32 2c-.22 0-.59.18-.63.42l-.28 1.66c-.09.52-.9.68-1.32.72l.41.27c.38.08 1.14-.3 1.21-.69l.28-1.66c.11-.66 2.78-.42 3.33-.42c-.15-.14-.25-.3-.49-.3zM4.29 6.74c-.07-.47-.01-.72.34-1.06l1.6-1.59c.22-.22.57-.13.81-.1c-.25-.21-.47-.41-.84-.33c-.34.07-2.16 1.9-2.24 2.24c-.08.36.12.59.33.84m9.8-2.14c.21.18.89.66 1.2.44l1.4-1.01l.56-.14c-.99-.78-1.49.68-2.35.88c-.23.05-.6-.13-.81-.17M5.1 7.79c-.04.41-.21 1.23-.72 1.32l-1.58.26c-.28.04-.5.38-.5.65v2.46c0 .23.13.35.25.52l.07-.01c-.04-.6-.15-2.39.02-2.89c.07-.19.25-.4.46-.43l1.58-.26l.31-.16c.31-.59.56-.88.11-1.46m9.2 1.87c.05.17.12.37.2.55l.1-.11zm-9.4 4.13c.04.2.28.7.14.9l-.97 1.33c-.25.35-.1.65.12.93c.14-.8.78-1.35 1.18-2.05c-.04-.43-.2-.79-.47-1.11m5.1.19v.07l.37.24l.14-.09z" class="wm-shine"/></g></svg>

reactReact 组件（TSX）

export function SettingsIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="1em"
      height="1em"
      viewBox="0 0 24 24"
      fill="currentColor"
      {...props}
      dangerouslySetInnerHTML={{ __html: `<g fill="none"><path fill="#0a0b26" fill-opacity=".2" d="M10.8 3c-1.2 0-1 1.9-1.3 2.6l-.5.1l-1.4-1c-.4-.2-1-.1-1.3.2L4.4 6.8c-.9.9.5 2.1.8 2.8l-.2.5l-1.7.3c-.5.1-.8.7-.8 1.1v2.7c0 1.2 1.9 1 2.5 1.3l.2.5l-1 1.4c-.2.4-.1 1 .2 1.3l1.9 1.9c.9.9 2.1-.5 2.8-.8l.5.2l.3 1.7c.1.5.7.8 1.1.8h2.7c1.2 0 1-1.9 1.3-2.6l.5-.1l1.4 1c.4.2 1 .1 1.3-.2l1.9-1.9c.9-.9-.5-2.1-.8-2.8l.2-.5l1.7-.3c.5-.1.8-.7.8-1.1v-2.7c0-1.2-1.9-1-2.6-1.3l-.1-.5l1-1.4c.2-.4.1-1-.2-1.3l-1.9-1.9c-.9-.9-2.1.5-2.8.8l-.5-.2l-.3-1.7c-.1-.5-.7-.8-1.1-.8zm1 8.2c1.9-.6 2.9 2.4 1 3.1c-2 .7-3.1-2.5-1-3.1" class="wm-shadow"/><path fill="#7b4a12" d="m15.33 10.61l-.53-1.06c-1.22-2.49-4.74-2.53-6.28-.38c-1.15 1.62-.57 4.16.71 5.55c2.3 2.48 6.38.84 6.39-2.52c.01-.53-.06-1.11-.29-1.59m-2.07.59c-.05 1.62-1.98 2.46-3.01 1.1c0-1.66 1.97-2.42 3.01-1.1" class="wm-a"/><path fill="#e3ae47" d="M11.22 7.59c-4.78.47-4.16 7.66.58 7.32c4.89-.34 4.25-7.78-.58-7.32m-.16 2.01c2.21-.62 3.1 2.71.98 3.3c-2.21.61-3.11-2.7-.98-3.3" class="wm-a"/><path fill="#7b4a12" fill-opacity=".62" d="M14.3 8.9c.2.5.5 1.1.5 1.8c.1 2.1-1.6 3.9-3.7 3.8c-.6 0-1.5-.3-1.9-.4c3.5 2.8 8.1-2 5.1-5.2M9.9 12c-.2-1.9.5-2.6 2.4-2.4c-1.6-1.4-3.8.8-2.4 2.4" class="wm-a"/><path fill="#ffefc4" fill-opacity=".24" d="M11.1 7.8c-4.3.5-3.8 7 .6 6.7c4.5-.3 3.8-7.2-.6-6.7m-.2 1.4c2.5-.6 3.6 3.1 1.2 3.9c-2.6.8-3.7-3.2-1.2-3.9" class="wm-a"/><path fill="#ffefc4" fill-opacity=".85" d="M8.4 13.11c-.11-.51-.31-1.05-.32-1.61c-.03-2.01 1.62-3.68 3.62-3.72c.6-.01 1.17.2 1.71.32c-3.33-1.85-6.86 1.68-5.01 5.01m4.8-2.55c.17 1.61-.51 2.7-2.29 2.31v.08c1.64.73 3.16-.77 2.29-2.39" class="wm-a"/><path fill="#fff" fill-opacity=".92" d="M9 13.23c-.15-.47-.36-.98-.4-1.52c-.11-1.81 1.41-3.39 3.21-3.41c.62-.01 1.18.23 1.72.4c-2.98-2.34-6.85 1.54-4.53 4.53" class="wm-a"/><path fill="#16206e" d="M10.12 1.6c-1.23.01-.8 2.05-1.18 2.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74 5.39c-.21.22-.31.73-.2 1.01l.31.8c.11.27.66.91.67 1.11c.04.88-2.65.04-2.64 1.69l.01 2.78l.34.84c.67 1.21 1.02.84 2.19 1.19c-.64.95-1.14 1.17-.7 2.41c.11.29.24.72.47.95l1.9 1.89c.34.33.98.27 1.33.01l1.21-.88c.14-.11.36.08.48.13l.15.88c.11.65.68 1.73 1.44 1.72l2.68-.01c1.22-.01.8-2.06 1.18-2.49l.64-.26l1.48 1.02c.35.25.96.07 1.24-.21l1.84-1.86c.98-1-.95-2.56-.72-3.11c.26-.62 2.59.09 2.58-1.5l-.01-2.88l-.31-.68c-.63-1.26-1.04-.9-2.22-1.25c.65-.97 1.24-1.41.62-2.65l-.39-.71l-1.9-1.89c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.17.13-.36-.1-.47-.17l-.2-1.08l-.51-1c-.15-.29-.58-.48-.89-.48zm1.33 8c.86-.17 2.41.25 2.73 1.19c.37 1.04-.42 2.33-1.32 2.82c-1.04.56-2.84.42-3.47-.75c-.71-1.33.78-3.01 2.06-3.26" class="wm-k"/><path fill="#2039b4" d="M10.12 1.6c-1.23.01-.8 2.05-1.18 2.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74 5.39c-.33.34-.27.98-.01 1.33l.88 1.21c.09.12-.15.72-.29.75l-1.7.3c-.42.08-.74.63-.74 1.02l.01 2.68c.01 1.22 2.07.8 2.49 1.18l.26.64l-1.02 1.48c-.25.35-.07.96.21 1.24l1.86 1.84c.34.33.98.27 1.33.01l1.21-.88c.12-.09.72.15.75.29l.3 1.7c.08.42.63.74 1.02.74l2.68-.01c1.22-.01.8-2.06 1.18-2.49l.64-.26l1.48 1.02c.35.25.96.07 1.24-.21l1.84-1.86c.33-.34.27-.98.01-1.33l-.88-1.21c-.09-.12.15-.72.29-.75l1.7-.3c.42-.08.74-.63.74-1.02l-.01-2.68c-.01-1.22-2.06-.8-2.49-1.18L18.46 8l1.02-1.48c.25-.35.07-.96-.21-1.24l-1.86-1.84c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.12.09-.72-.15-.75-.29l-.3-1.7c-.08-.42-.63-.74-1.02-.74zm.93 7c3.45-.68 4.48 4.61 1 5.3c-3.45.68-4.48-4.61-1-5.3" class="wm-k"/><path fill="#0a0b26" fill-opacity=".34" d="m13.5 1.9l.2 1.7c.1 0 .2.1.3.2c0-.7 0-1.4-.5-1.9m5.6 3.3c.1.2.2.7 0 .9l-1 1.5c.1.3.2.5.3.7c.2-1 2-2 .7-3.1m-9.9 7.5l-.3-.9c-.1-.5-.1-1.3.2-1.7l.5-.7l.7-.5l.9-.3h.9l.9.3c-2.6-2.3-6.1 1.2-3.8 3.8m11.6-3.5V12c0 .4-.2 1-.7 1.1l-1.8.4l-.2.6l.3.4l.4-.7l1.7-.3c.4-.1.7-.6.7-1V9.9c0-.3-.2-.5-.4-.7M2.1 13.1c.4.5 1.3.6 2 .6c-.1-.1-.2-.2-.2-.3zm16.4 1.5c.4.8 1.1 1.5.2 2.4l-1.6 1.6c-.7.7-1.6-.1-2.2-.4l1.4 1c.8.6 3.8-2.4 3.2-3.2zM7.9 17.8l-1.5 1l-.9.1c.3.3.9.6 1.3.3l1.4-1h.4l-.1-.2zm6.4 0l-.6.3l-.3 1.7c-.2 1.1-3.2.7-3.9.7c.2.2.5.4.8.4h2.5c.4 0 .9-.3 1-.7l.3-1.7l.7-.4c-.1-.2-.3-.2-.5-.3" class="wm-k"/><path fill="#fff" fill-opacity=".075" d="M10.1 1.8c-.2 0-.6.3-.6.5L9.2 4c-.1.4-.7.5-1 .5c-.7-.5-1.7-1.6-2.5-.8L3.9 5.5c-.2.2-.3.7-.1 1l1 1.4c0 .3-.1.9-.5 1l-1.7.3c-.2 0-.4.3-.5.6c-.1.7-.4 3.4.6 3.6l1.8.3l.3.7c-.2.7-.9 1.2-1.1 1.9c0 2 4.6 1.7 5.9 1.5c3.7-.7 6.8-3.2 8.2-6.7c.5-1.1.7-2 .5-3.2l.3-.5l-.1-1.6l-.2-1.2l-1-1c-.2-.2-.7-.3-1-.1l-1.4 1c-.2.2-.7-.2-.9-.3l-.3-1.8c-.1-.4-.6-.6-1-.6zm1 6.6c3.8-.5 4.6 5.2.9 5.7c-3.8.5-4.6-5.2-.9-5.7" class="wm-k"/><path fill="#fff" fill-opacity=".42" d="M10.12 1.6c-.43 0-.82.51-.89.9l-.25 1.52c-.03.15-.56.31-.69.38l.14.11c.15-.03.71-.06.75-.29l.3-1.7c.2-1.1 3.14-.76 3.94-.72c-.21-.11-.37-.22-.62-.22zM3.8 6.81c-.06-.31-.13-.65 0-.97c.16-.39 1.96-2.19 2.35-2.34c.32-.13.65-.06.96 0c-.32-.2-.61-.35-1.01-.25c-.5.12-2.37 1.96-2.52 2.46c-.14.43 0 .75.22 1.1m12.28-3.38l-1.21.88c-.13.1-.35-.06-.47-.11l-.02.08l.62.26l1.4-.99c.25-.17.66-.13.92-.14c-.41-.2-.84-.28-1.24.02M4.7 7.99c-.12.24-.24.48-.38.69l-1.7.3c-.42.08-.74.63-.74 1.02v2.4c0 .3.09.47.22.72l.01-3.15c.07-.26.23-.5.45-.66c.53-.37 1.42-.31 2.02-.47l.25-.55c-.04-.08-.09-.21-.13-.3m14.22.76v.09l.12.06l1.56.25l.11-.04c-.54-.27-1.19-.32-1.79-.36M14 9.98l.24 1.12c.06 1.45-1.06 2.78-2.54 2.84c-.5.02-.96-.13-1.42-.24c2.54 1.49 5.21-1.18 3.72-3.72m-9.48 4.1c.03.08.17.38.09.49l-.84 1.15c-.32.43-.28.85-.06 1.31c.01-.23-.04-.64.11-.85l1.02-1.48l-.22-.58zm4.57 4.51l-.06.11l.18 1.21c.03.2.11.33.2.5l.04-.11l-.25-1.56z" class="wm-k"/><path fill="#fff" fill-opacity=".92" d="M10.32 2c-.22 0-.59.18-.63.42l-.28 1.66c-.09.52-.9.68-1.32.72l.41.27c.38.08 1.14-.3 1.21-.69l.28-1.66c.11-.66 2.78-.42 3.33-.42c-.15-.14-.25-.3-.49-.3zM4.29 6.74c-.07-.47-.01-.72.34-1.06l1.6-1.59c.22-.22.57-.13.81-.1c-.25-.21-.47-.41-.84-.33c-.34.07-2.16 1.9-2.24 2.24c-.08.36.12.59.33.84m9.8-2.14c.21.18.89.66 1.2.44l1.4-1.01l.56-.14c-.99-.78-1.49.68-2.35.88c-.23.05-.6-.13-.81-.17M5.1 7.79c-.04.41-.21 1.23-.72 1.32l-1.58.26c-.28.04-.5.38-.5.65v2.46c0 .23.13.35.25.52l.07-.01c-.04-.6-.15-2.39.02-2.89c.07-.19.25-.4.46-.43l1.58-.26l.31-.16c.31-.59.56-.88.11-1.46m9.2 1.87c.05.17.12.37.2.55l.1-.11zm-9.4 4.13c.04.2.28.7.14.9l-.97 1.33c-.25.35-.1.65.12.93c.14-.8.78-1.35 1.18-2.05c-.04-.43-.2-.79-.47-1.11m5.1.19v.07l.37.24l.14-.09z" class="wm-shine"/></g>` }}
    />
  );
}

vueVue 3 组件

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" v-html="body"></svg>
</template>

<script setup>
const body = `<g fill="none"><path fill="#0a0b26" fill-opacity=".2" d="M10.8 3c-1.2 0-1 1.9-1.3 2.6l-.5.1l-1.4-1c-.4-.2-1-.1-1.3.2L4.4 6.8c-.9.9.5 2.1.8 2.8l-.2.5l-1.7.3c-.5.1-.8.7-.8 1.1v2.7c0 1.2 1.9 1 2.5 1.3l.2.5l-1 1.4c-.2.4-.1 1 .2 1.3l1.9 1.9c.9.9 2.1-.5 2.8-.8l.5.2l.3 1.7c.1.5.7.8 1.1.8h2.7c1.2 0 1-1.9 1.3-2.6l.5-.1l1.4 1c.4.2 1 .1 1.3-.2l1.9-1.9c.9-.9-.5-2.1-.8-2.8l.2-.5l1.7-.3c.5-.1.8-.7.8-1.1v-2.7c0-1.2-1.9-1-2.6-1.3l-.1-.5l1-1.4c.2-.4.1-1-.2-1.3l-1.9-1.9c-.9-.9-2.1.5-2.8.8l-.5-.2l-.3-1.7c-.1-.5-.7-.8-1.1-.8zm1 8.2c1.9-.6 2.9 2.4 1 3.1c-2 .7-3.1-2.5-1-3.1" class="wm-shadow"/><path fill="#7b4a12" d="m15.33 10.61l-.53-1.06c-1.22-2.49-4.74-2.53-6.28-.38c-1.15 1.62-.57 4.16.71 5.55c2.3 2.48 6.38.84 6.39-2.52c.01-.53-.06-1.11-.29-1.59m-2.07.59c-.05 1.62-1.98 2.46-3.01 1.1c0-1.66 1.97-2.42 3.01-1.1" class="wm-a"/><path fill="#e3ae47" d="M11.22 7.59c-4.78.47-4.16 7.66.58 7.32c4.89-.34 4.25-7.78-.58-7.32m-.16 2.01c2.21-.62 3.1 2.71.98 3.3c-2.21.61-3.11-2.7-.98-3.3" class="wm-a"/><path fill="#7b4a12" fill-opacity=".62" d="M14.3 8.9c.2.5.5 1.1.5 1.8c.1 2.1-1.6 3.9-3.7 3.8c-.6 0-1.5-.3-1.9-.4c3.5 2.8 8.1-2 5.1-5.2M9.9 12c-.2-1.9.5-2.6 2.4-2.4c-1.6-1.4-3.8.8-2.4 2.4" class="wm-a"/><path fill="#ffefc4" fill-opacity=".24" d="M11.1 7.8c-4.3.5-3.8 7 .6 6.7c4.5-.3 3.8-7.2-.6-6.7m-.2 1.4c2.5-.6 3.6 3.1 1.2 3.9c-2.6.8-3.7-3.2-1.2-3.9" class="wm-a"/><path fill="#ffefc4" fill-opacity=".85" d="M8.4 13.11c-.11-.51-.31-1.05-.32-1.61c-.03-2.01 1.62-3.68 3.62-3.72c.6-.01 1.17.2 1.71.32c-3.33-1.85-6.86 1.68-5.01 5.01m4.8-2.55c.17 1.61-.51 2.7-2.29 2.31v.08c1.64.73 3.16-.77 2.29-2.39" class="wm-a"/><path fill="#fff" fill-opacity=".92" d="M9 13.23c-.15-.47-.36-.98-.4-1.52c-.11-1.81 1.41-3.39 3.21-3.41c.62-.01 1.18.23 1.72.4c-2.98-2.34-6.85 1.54-4.53 4.53" class="wm-a"/><path fill="#16206e" d="M10.12 1.6c-1.23.01-.8 2.05-1.18 2.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74 5.39c-.21.22-.31.73-.2 1.01l.31.8c.11.27.66.91.67 1.11c.04.88-2.65.04-2.64 1.69l.01 2.78l.34.84c.67 1.21 1.02.84 2.19 1.19c-.64.95-1.14 1.17-.7 2.41c.11.29.24.72.47.95l1.9 1.89c.34.33.98.27 1.33.01l1.21-.88c.14-.11.36.08.48.13l.15.88c.11.65.68 1.73 1.44 1.72l2.68-.01c1.22-.01.8-2.06 1.18-2.49l.64-.26l1.48 1.02c.35.25.96.07 1.24-.21l1.84-1.86c.98-1-.95-2.56-.72-3.11c.26-.62 2.59.09 2.58-1.5l-.01-2.88l-.31-.68c-.63-1.26-1.04-.9-2.22-1.25c.65-.97 1.24-1.41.62-2.65l-.39-.71l-1.9-1.89c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.17.13-.36-.1-.47-.17l-.2-1.08l-.51-1c-.15-.29-.58-.48-.89-.48zm1.33 8c.86-.17 2.41.25 2.73 1.19c.37 1.04-.42 2.33-1.32 2.82c-1.04.56-2.84.42-3.47-.75c-.71-1.33.78-3.01 2.06-3.26" class="wm-k"/><path fill="#2039b4" d="M10.12 1.6c-1.23.01-.8 2.05-1.18 2.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74 5.39c-.33.34-.27.98-.01 1.33l.88 1.21c.09.12-.15.72-.29.75l-1.7.3c-.42.08-.74.63-.74 1.02l.01 2.68c.01 1.22 2.07.8 2.49 1.18l.26.64l-1.02 1.48c-.25.35-.07.96.21 1.24l1.86 1.84c.34.33.98.27 1.33.01l1.21-.88c.12-.09.72.15.75.29l.3 1.7c.08.42.63.74 1.02.74l2.68-.01c1.22-.01.8-2.06 1.18-2.49l.64-.26l1.48 1.02c.35.25.96.07 1.24-.21l1.84-1.86c.33-.34.27-.98.01-1.33l-.88-1.21c-.09-.12.15-.72.29-.75l1.7-.3c.42-.08.74-.63.74-1.02l-.01-2.68c-.01-1.22-2.06-.8-2.49-1.18L18.46 8l1.02-1.48c.25-.35.07-.96-.21-1.24l-1.86-1.84c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.12.09-.72-.15-.75-.29l-.3-1.7c-.08-.42-.63-.74-1.02-.74zm.93 7c3.45-.68 4.48 4.61 1 5.3c-3.45.68-4.48-4.61-1-5.3" class="wm-k"/><path fill="#0a0b26" fill-opacity=".34" d="m13.5 1.9l.2 1.7c.1 0 .2.1.3.2c0-.7 0-1.4-.5-1.9m5.6 3.3c.1.2.2.7 0 .9l-1 1.5c.1.3.2.5.3.7c.2-1 2-2 .7-3.1m-9.9 7.5l-.3-.9c-.1-.5-.1-1.3.2-1.7l.5-.7l.7-.5l.9-.3h.9l.9.3c-2.6-2.3-6.1 1.2-3.8 3.8m11.6-3.5V12c0 .4-.2 1-.7 1.1l-1.8.4l-.2.6l.3.4l.4-.7l1.7-.3c.4-.1.7-.6.7-1V9.9c0-.3-.2-.5-.4-.7M2.1 13.1c.4.5 1.3.6 2 .6c-.1-.1-.2-.2-.2-.3zm16.4 1.5c.4.8 1.1 1.5.2 2.4l-1.6 1.6c-.7.7-1.6-.1-2.2-.4l1.4 1c.8.6 3.8-2.4 3.2-3.2zM7.9 17.8l-1.5 1l-.9.1c.3.3.9.6 1.3.3l1.4-1h.4l-.1-.2zm6.4 0l-.6.3l-.3 1.7c-.2 1.1-3.2.7-3.9.7c.2.2.5.4.8.4h2.5c.4 0 .9-.3 1-.7l.3-1.7l.7-.4c-.1-.2-.3-.2-.5-.3" class="wm-k"/><path fill="#fff" fill-opacity=".075" d="M10.1 1.8c-.2 0-.6.3-.6.5L9.2 4c-.1.4-.7.5-1 .5c-.7-.5-1.7-1.6-2.5-.8L3.9 5.5c-.2.2-.3.7-.1 1l1 1.4c0 .3-.1.9-.5 1l-1.7.3c-.2 0-.4.3-.5.6c-.1.7-.4 3.4.6 3.6l1.8.3l.3.7c-.2.7-.9 1.2-1.1 1.9c0 2 4.6 1.7 5.9 1.5c3.7-.7 6.8-3.2 8.2-6.7c.5-1.1.7-2 .5-3.2l.3-.5l-.1-1.6l-.2-1.2l-1-1c-.2-.2-.7-.3-1-.1l-1.4 1c-.2.2-.7-.2-.9-.3l-.3-1.8c-.1-.4-.6-.6-1-.6zm1 6.6c3.8-.5 4.6 5.2.9 5.7c-3.8.5-4.6-5.2-.9-5.7" class="wm-k"/><path fill="#fff" fill-opacity=".42" d="M10.12 1.6c-.43 0-.82.51-.89.9l-.25 1.52c-.03.15-.56.31-.69.38l.14.11c.15-.03.71-.06.75-.29l.3-1.7c.2-1.1 3.14-.76 3.94-.72c-.21-.11-.37-.22-.62-.22zM3.8 6.81c-.06-.31-.13-.65 0-.97c.16-.39 1.96-2.19 2.35-2.34c.32-.13.65-.06.96 0c-.32-.2-.61-.35-1.01-.25c-.5.12-2.37 1.96-2.52 2.46c-.14.43 0 .75.22 1.1m12.28-3.38l-1.21.88c-.13.1-.35-.06-.47-.11l-.02.08l.62.26l1.4-.99c.25-.17.66-.13.92-.14c-.41-.2-.84-.28-1.24.02M4.7 7.99c-.12.24-.24.48-.38.69l-1.7.3c-.42.08-.74.63-.74 1.02v2.4c0 .3.09.47.22.72l.01-3.15c.07-.26.23-.5.45-.66c.53-.37 1.42-.31 2.02-.47l.25-.55c-.04-.08-.09-.21-.13-.3m14.22.76v.09l.12.06l1.56.25l.11-.04c-.54-.27-1.19-.32-1.79-.36M14 9.98l.24 1.12c.06 1.45-1.06 2.78-2.54 2.84c-.5.02-.96-.13-1.42-.24c2.54 1.49 5.21-1.18 3.72-3.72m-9.48 4.1c.03.08.17.38.09.49l-.84 1.15c-.32.43-.28.85-.06 1.31c.01-.23-.04-.64.11-.85l1.02-1.48l-.22-.58zm4.57 4.51l-.06.11l.18 1.21c.03.2.11.33.2.5l.04-.11l-.25-1.56z" class="wm-k"/><path fill="#fff" fill-opacity=".92" d="M10.32 2c-.22 0-.59.18-.63.42l-.28 1.66c-.09.52-.9.68-1.32.72l.41.27c.38.08 1.14-.3 1.21-.69l.28-1.66c.11-.66 2.78-.42 3.33-.42c-.15-.14-.25-.3-.49-.3zM4.29 6.74c-.07-.47-.01-.72.34-1.06l1.6-1.59c.22-.22.57-.13.81-.1c-.25-.21-.47-.41-.84-.33c-.34.07-2.16 1.9-2.24 2.24c-.08.36.12.59.33.84m9.8-2.14c.21.18.89.66 1.2.44l1.4-1.01l.56-.14c-.99-.78-1.49.68-2.35.88c-.23.05-.6-.13-.81-.17M5.1 7.79c-.04.41-.21 1.23-.72 1.32l-1.58.26c-.28.04-.5.38-.5.65v2.46c0 .23.13.35.25.52l.07-.01c-.04-.6-.15-2.39.02-2.89c.07-.19.25-.4.46-.43l1.58-.26l.31-.16c.31-.59.56-.88.11-1.46m9.2 1.87c.05.17.12.37.2.55l.1-.11zm-9.4 4.13c.04.2.28.7.14.9l-.97 1.33c-.25.35-.1.65.12.93c.14-.8.78-1.35 1.18-2.05c-.04-.43-.2-.79-.47-1.11m5.1.19v.07l.37.24l.14-.09z" class="wm-shine"/></g>`;
</script>

cssCSS mask（随 currentColor 改色）

.settings {
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%230a0b26%22%20fill-opacity%3D%22.2%22%20d%3D%22M10.8%203c-1.2%200-1%201.9-1.3%202.6l-.5.1l-1.4-1c-.4-.2-1-.1-1.3.2L4.4%206.8c-.9.9.5%202.1.8%202.8l-.2.5l-1.7.3c-.5.1-.8.7-.8%201.1v2.7c0%201.2%201.9%201%202.5%201.3l.2.5l-1%201.4c-.2.4-.1%201%20.2%201.3l1.9%201.9c.9.9%202.1-.5%202.8-.8l.5.2l.3%201.7c.1.5.7.8%201.1.8h2.7c1.2%200%201-1.9%201.3-2.6l.5-.1l1.4%201c.4.2%201%20.1%201.3-.2l1.9-1.9c.9-.9-.5-2.1-.8-2.8l.2-.5l1.7-.3c.5-.1.8-.7.8-1.1v-2.7c0-1.2-1.9-1-2.6-1.3l-.1-.5l1-1.4c.2-.4.1-1-.2-1.3l-1.9-1.9c-.9-.9-2.1.5-2.8.8l-.5-.2l-.3-1.7c-.1-.5-.7-.8-1.1-.8zm1%208.2c1.9-.6%202.9%202.4%201%203.1c-2%20.7-3.1-2.5-1-3.1%22%20class%3D%22wm-shadow%22%2F%3E%3Cpath%20fill%3D%22%237b4a12%22%20d%3D%22m15.33%2010.61l-.53-1.06c-1.22-2.49-4.74-2.53-6.28-.38c-1.15%201.62-.57%204.16.71%205.55c2.3%202.48%206.38.84%206.39-2.52c.01-.53-.06-1.11-.29-1.59m-2.07.59c-.05%201.62-1.98%202.46-3.01%201.1c0-1.66%201.97-2.42%203.01-1.1%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23e3ae47%22%20d%3D%22M11.22%207.59c-4.78.47-4.16%207.66.58%207.32c4.89-.34%204.25-7.78-.58-7.32m-.16%202.01c2.21-.62%203.1%202.71.98%203.3c-2.21.61-3.11-2.7-.98-3.3%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%237b4a12%22%20fill-opacity%3D%22.62%22%20d%3D%22M14.3%208.9c.2.5.5%201.1.5%201.8c.1%202.1-1.6%203.9-3.7%203.8c-.6%200-1.5-.3-1.9-.4c3.5%202.8%208.1-2%205.1-5.2M9.9%2012c-.2-1.9.5-2.6%202.4-2.4c-1.6-1.4-3.8.8-2.4%202.4%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23ffefc4%22%20fill-opacity%3D%22.24%22%20d%3D%22M11.1%207.8c-4.3.5-3.8%207%20.6%206.7c4.5-.3%203.8-7.2-.6-6.7m-.2%201.4c2.5-.6%203.6%203.1%201.2%203.9c-2.6.8-3.7-3.2-1.2-3.9%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23ffefc4%22%20fill-opacity%3D%22.85%22%20d%3D%22M8.4%2013.11c-.11-.51-.31-1.05-.32-1.61c-.03-2.01%201.62-3.68%203.62-3.72c.6-.01%201.17.2%201.71.32c-3.33-1.85-6.86%201.68-5.01%205.01m4.8-2.55c.17%201.61-.51%202.7-2.29%202.31v.08c1.64.73%203.16-.77%202.29-2.39%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.92%22%20d%3D%22M9%2013.23c-.15-.47-.36-.98-.4-1.52c-.11-1.81%201.41-3.39%203.21-3.41c.62-.01%201.18.23%201.72.4c-2.98-2.34-6.85%201.54-4.53%204.53%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%2316206e%22%20d%3D%22M10.12%201.6c-1.23.01-.8%202.05-1.18%202.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74%205.39c-.21.22-.31.73-.2%201.01l.31.8c.11.27.66.91.67%201.11c.04.88-2.65.04-2.64%201.69l.01%202.78l.34.84c.67%201.21%201.02.84%202.19%201.19c-.64.95-1.14%201.17-.7%202.41c.11.29.24.72.47.95l1.9%201.89c.34.33.98.27%201.33.01l1.21-.88c.14-.11.36.08.48.13l.15.88c.11.65.68%201.73%201.44%201.72l2.68-.01c1.22-.01.8-2.06%201.18-2.49l.64-.26l1.48%201.02c.35.25.96.07%201.24-.21l1.84-1.86c.98-1-.95-2.56-.72-3.11c.26-.62%202.59.09%202.58-1.5l-.01-2.88l-.31-.68c-.63-1.26-1.04-.9-2.22-1.25c.65-.97%201.24-1.41.62-2.65l-.39-.71l-1.9-1.89c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.17.13-.36-.1-.47-.17l-.2-1.08l-.51-1c-.15-.29-.58-.48-.89-.48zm1.33%208c.86-.17%202.41.25%202.73%201.19c.37%201.04-.42%202.33-1.32%202.82c-1.04.56-2.84.42-3.47-.75c-.71-1.33.78-3.01%202.06-3.26%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%232039b4%22%20d%3D%22M10.12%201.6c-1.23.01-.8%202.05-1.18%202.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74%205.39c-.33.34-.27.98-.01%201.33l.88%201.21c.09.12-.15.72-.29.75l-1.7.3c-.42.08-.74.63-.74%201.02l.01%202.68c.01%201.22%202.07.8%202.49%201.18l.26.64l-1.02%201.48c-.25.35-.07.96.21%201.24l1.86%201.84c.34.33.98.27%201.33.01l1.21-.88c.12-.09.72.15.75.29l.3%201.7c.08.42.63.74%201.02.74l2.68-.01c1.22-.01.8-2.06%201.18-2.49l.64-.26l1.48%201.02c.35.25.96.07%201.24-.21l1.84-1.86c.33-.34.27-.98.01-1.33l-.88-1.21c-.09-.12.15-.72.29-.75l1.7-.3c.42-.08.74-.63.74-1.02l-.01-2.68c-.01-1.22-2.06-.8-2.49-1.18L18.46%208l1.02-1.48c.25-.35.07-.96-.21-1.24l-1.86-1.84c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.12.09-.72-.15-.75-.29l-.3-1.7c-.08-.42-.63-.74-1.02-.74zm.93%207c3.45-.68%204.48%204.61%201%205.3c-3.45.68-4.48-4.61-1-5.3%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%230a0b26%22%20fill-opacity%3D%22.34%22%20d%3D%22m13.5%201.9l.2%201.7c.1%200%20.2.1.3.2c0-.7%200-1.4-.5-1.9m5.6%203.3c.1.2.2.7%200%20.9l-1%201.5c.1.3.2.5.3.7c.2-1%202-2%20.7-3.1m-9.9%207.5l-.3-.9c-.1-.5-.1-1.3.2-1.7l.5-.7l.7-.5l.9-.3h.9l.9.3c-2.6-2.3-6.1%201.2-3.8%203.8m11.6-3.5V12c0%20.4-.2%201-.7%201.1l-1.8.4l-.2.6l.3.4l.4-.7l1.7-.3c.4-.1.7-.6.7-1V9.9c0-.3-.2-.5-.4-.7M2.1%2013.1c.4.5%201.3.6%202%20.6c-.1-.1-.2-.2-.2-.3zm16.4%201.5c.4.8%201.1%201.5.2%202.4l-1.6%201.6c-.7.7-1.6-.1-2.2-.4l1.4%201c.8.6%203.8-2.4%203.2-3.2zM7.9%2017.8l-1.5%201l-.9.1c.3.3.9.6%201.3.3l1.4-1h.4l-.1-.2zm6.4%200l-.6.3l-.3%201.7c-.2%201.1-3.2.7-3.9.7c.2.2.5.4.8.4h2.5c.4%200%20.9-.3%201-.7l.3-1.7l.7-.4c-.1-.2-.3-.2-.5-.3%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.075%22%20d%3D%22M10.1%201.8c-.2%200-.6.3-.6.5L9.2%204c-.1.4-.7.5-1%20.5c-.7-.5-1.7-1.6-2.5-.8L3.9%205.5c-.2.2-.3.7-.1%201l1%201.4c0%20.3-.1.9-.5%201l-1.7.3c-.2%200-.4.3-.5.6c-.1.7-.4%203.4.6%203.6l1.8.3l.3.7c-.2.7-.9%201.2-1.1%201.9c0%202%204.6%201.7%205.9%201.5c3.7-.7%206.8-3.2%208.2-6.7c.5-1.1.7-2%20.5-3.2l.3-.5l-.1-1.6l-.2-1.2l-1-1c-.2-.2-.7-.3-1-.1l-1.4%201c-.2.2-.7-.2-.9-.3l-.3-1.8c-.1-.4-.6-.6-1-.6zm1%206.6c3.8-.5%204.6%205.2.9%205.7c-3.8.5-4.6-5.2-.9-5.7%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.42%22%20d%3D%22M10.12%201.6c-.43%200-.82.51-.89.9l-.25%201.52c-.03.15-.56.31-.69.38l.14.11c.15-.03.71-.06.75-.29l.3-1.7c.2-1.1%203.14-.76%203.94-.72c-.21-.11-.37-.22-.62-.22zM3.8%206.81c-.06-.31-.13-.65%200-.97c.16-.39%201.96-2.19%202.35-2.34c.32-.13.65-.06.96%200c-.32-.2-.61-.35-1.01-.25c-.5.12-2.37%201.96-2.52%202.46c-.14.43%200%20.75.22%201.1m12.28-3.38l-1.21.88c-.13.1-.35-.06-.47-.11l-.02.08l.62.26l1.4-.99c.25-.17.66-.13.92-.14c-.41-.2-.84-.28-1.24.02M4.7%207.99c-.12.24-.24.48-.38.69l-1.7.3c-.42.08-.74.63-.74%201.02v2.4c0%20.3.09.47.22.72l.01-3.15c.07-.26.23-.5.45-.66c.53-.37%201.42-.31%202.02-.47l.25-.55c-.04-.08-.09-.21-.13-.3m14.22.76v.09l.12.06l1.56.25l.11-.04c-.54-.27-1.19-.32-1.79-.36M14%209.98l.24%201.12c.06%201.45-1.06%202.78-2.54%202.84c-.5.02-.96-.13-1.42-.24c2.54%201.49%205.21-1.18%203.72-3.72m-9.48%204.1c.03.08.17.38.09.49l-.84%201.15c-.32.43-.28.85-.06%201.31c.01-.23-.04-.64.11-.85l1.02-1.48l-.22-.58zm4.57%204.51l-.06.11l.18%201.21c.03.2.11.33.2.5l.04-.11l-.25-1.56z%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.92%22%20d%3D%22M10.32%202c-.22%200-.59.18-.63.42l-.28%201.66c-.09.52-.9.68-1.32.72l.41.27c.38.08%201.14-.3%201.21-.69l.28-1.66c.11-.66%202.78-.42%203.33-.42c-.15-.14-.25-.3-.49-.3zM4.29%206.74c-.07-.47-.01-.72.34-1.06l1.6-1.59c.22-.22.57-.13.81-.1c-.25-.21-.47-.41-.84-.33c-.34.07-2.16%201.9-2.24%202.24c-.08.36.12.59.33.84m9.8-2.14c.21.18.89.66%201.2.44l1.4-1.01l.56-.14c-.99-.78-1.49.68-2.35.88c-.23.05-.6-.13-.81-.17M5.1%207.79c-.04.41-.21%201.23-.72%201.32l-1.58.26c-.28.04-.5.38-.5.65v2.46c0%20.23.13.35.25.52l.07-.01c-.04-.6-.15-2.39.02-2.89c.07-.19.25-.4.46-.43l1.58-.26l.31-.16c.31-.59.56-.88.11-1.46m9.2%201.87c.05.17.12.37.2.55l.1-.11zm-9.4%204.13c.04.2.28.7.14.9l-.97%201.33c-.25.35-.1.65.12.93c.14-.8.78-1.35%201.18-2.05c-.04-.43-.2-.79-.47-1.11m5.1.19v.07l.37.24l.14-.09z%22%20class%3D%22wm-shine%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%230a0b26%22%20fill-opacity%3D%22.2%22%20d%3D%22M10.8%203c-1.2%200-1%201.9-1.3%202.6l-.5.1l-1.4-1c-.4-.2-1-.1-1.3.2L4.4%206.8c-.9.9.5%202.1.8%202.8l-.2.5l-1.7.3c-.5.1-.8.7-.8%201.1v2.7c0%201.2%201.9%201%202.5%201.3l.2.5l-1%201.4c-.2.4-.1%201%20.2%201.3l1.9%201.9c.9.9%202.1-.5%202.8-.8l.5.2l.3%201.7c.1.5.7.8%201.1.8h2.7c1.2%200%201-1.9%201.3-2.6l.5-.1l1.4%201c.4.2%201%20.1%201.3-.2l1.9-1.9c.9-.9-.5-2.1-.8-2.8l.2-.5l1.7-.3c.5-.1.8-.7.8-1.1v-2.7c0-1.2-1.9-1-2.6-1.3l-.1-.5l1-1.4c.2-.4.1-1-.2-1.3l-1.9-1.9c-.9-.9-2.1.5-2.8.8l-.5-.2l-.3-1.7c-.1-.5-.7-.8-1.1-.8zm1%208.2c1.9-.6%202.9%202.4%201%203.1c-2%20.7-3.1-2.5-1-3.1%22%20class%3D%22wm-shadow%22%2F%3E%3Cpath%20fill%3D%22%237b4a12%22%20d%3D%22m15.33%2010.61l-.53-1.06c-1.22-2.49-4.74-2.53-6.28-.38c-1.15%201.62-.57%204.16.71%205.55c2.3%202.48%206.38.84%206.39-2.52c.01-.53-.06-1.11-.29-1.59m-2.07.59c-.05%201.62-1.98%202.46-3.01%201.1c0-1.66%201.97-2.42%203.01-1.1%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23e3ae47%22%20d%3D%22M11.22%207.59c-4.78.47-4.16%207.66.58%207.32c4.89-.34%204.25-7.78-.58-7.32m-.16%202.01c2.21-.62%203.1%202.71.98%203.3c-2.21.61-3.11-2.7-.98-3.3%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%237b4a12%22%20fill-opacity%3D%22.62%22%20d%3D%22M14.3%208.9c.2.5.5%201.1.5%201.8c.1%202.1-1.6%203.9-3.7%203.8c-.6%200-1.5-.3-1.9-.4c3.5%202.8%208.1-2%205.1-5.2M9.9%2012c-.2-1.9.5-2.6%202.4-2.4c-1.6-1.4-3.8.8-2.4%202.4%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23ffefc4%22%20fill-opacity%3D%22.24%22%20d%3D%22M11.1%207.8c-4.3.5-3.8%207%20.6%206.7c4.5-.3%203.8-7.2-.6-6.7m-.2%201.4c2.5-.6%203.6%203.1%201.2%203.9c-2.6.8-3.7-3.2-1.2-3.9%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23ffefc4%22%20fill-opacity%3D%22.85%22%20d%3D%22M8.4%2013.11c-.11-.51-.31-1.05-.32-1.61c-.03-2.01%201.62-3.68%203.62-3.72c.6-.01%201.17.2%201.71.32c-3.33-1.85-6.86%201.68-5.01%205.01m4.8-2.55c.17%201.61-.51%202.7-2.29%202.31v.08c1.64.73%203.16-.77%202.29-2.39%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.92%22%20d%3D%22M9%2013.23c-.15-.47-.36-.98-.4-1.52c-.11-1.81%201.41-3.39%203.21-3.41c.62-.01%201.18.23%201.72.4c-2.98-2.34-6.85%201.54-4.53%204.53%22%20class%3D%22wm-a%22%2F%3E%3Cpath%20fill%3D%22%2316206e%22%20d%3D%22M10.12%201.6c-1.23.01-.8%202.05-1.18%202.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74%205.39c-.21.22-.31.73-.2%201.01l.31.8c.11.27.66.91.67%201.11c.04.88-2.65.04-2.64%201.69l.01%202.78l.34.84c.67%201.21%201.02.84%202.19%201.19c-.64.95-1.14%201.17-.7%202.41c.11.29.24.72.47.95l1.9%201.89c.34.33.98.27%201.33.01l1.21-.88c.14-.11.36.08.48.13l.15.88c.11.65.68%201.73%201.44%201.72l2.68-.01c1.22-.01.8-2.06%201.18-2.49l.64-.26l1.48%201.02c.35.25.96.07%201.24-.21l1.84-1.86c.98-1-.95-2.56-.72-3.11c.26-.62%202.59.09%202.58-1.5l-.01-2.88l-.31-.68c-.63-1.26-1.04-.9-2.22-1.25c.65-.97%201.24-1.41.62-2.65l-.39-.71l-1.9-1.89c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.17.13-.36-.1-.47-.17l-.2-1.08l-.51-1c-.15-.29-.58-.48-.89-.48zm1.33%208c.86-.17%202.41.25%202.73%201.19c.37%201.04-.42%202.33-1.32%202.82c-1.04.56-2.84.42-3.47-.75c-.71-1.33.78-3.01%202.06-3.26%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%232039b4%22%20d%3D%22M10.12%201.6c-1.23.01-.8%202.05-1.18%202.48l-.64.26l-1.48-1.02c-.35-.25-.96-.07-1.24.21L3.74%205.39c-.33.34-.27.98-.01%201.33l.88%201.21c.09.12-.15.72-.29.75l-1.7.3c-.42.08-.74.63-.74%201.02l.01%202.68c.01%201.22%202.07.8%202.49%201.18l.26.64l-1.02%201.48c-.25.35-.07.96.21%201.24l1.86%201.84c.34.33.98.27%201.33.01l1.21-.88c.12-.09.72.15.75.29l.3%201.7c.08.42.63.74%201.02.74l2.68-.01c1.22-.01.8-2.06%201.18-2.49l.64-.26l1.48%201.02c.35.25.96.07%201.24-.21l1.84-1.86c.33-.34.27-.98.01-1.33l-.88-1.21c-.09-.12.15-.72.29-.75l1.7-.3c.42-.08.74-.63.74-1.02l-.01-2.68c-.01-1.22-2.06-.8-2.49-1.18L18.46%208l1.02-1.48c.25-.35.07-.96-.21-1.24l-1.86-1.84c-.34-.33-.98-.27-1.33-.01l-1.21.88c-.12.09-.72-.15-.75-.29l-.3-1.7c-.08-.42-.63-.74-1.02-.74zm.93%207c3.45-.68%204.48%204.61%201%205.3c-3.45.68-4.48-4.61-1-5.3%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%230a0b26%22%20fill-opacity%3D%22.34%22%20d%3D%22m13.5%201.9l.2%201.7c.1%200%20.2.1.3.2c0-.7%200-1.4-.5-1.9m5.6%203.3c.1.2.2.7%200%20.9l-1%201.5c.1.3.2.5.3.7c.2-1%202-2%20.7-3.1m-9.9%207.5l-.3-.9c-.1-.5-.1-1.3.2-1.7l.5-.7l.7-.5l.9-.3h.9l.9.3c-2.6-2.3-6.1%201.2-3.8%203.8m11.6-3.5V12c0%20.4-.2%201-.7%201.1l-1.8.4l-.2.6l.3.4l.4-.7l1.7-.3c.4-.1.7-.6.7-1V9.9c0-.3-.2-.5-.4-.7M2.1%2013.1c.4.5%201.3.6%202%20.6c-.1-.1-.2-.2-.2-.3zm16.4%201.5c.4.8%201.1%201.5.2%202.4l-1.6%201.6c-.7.7-1.6-.1-2.2-.4l1.4%201c.8.6%203.8-2.4%203.2-3.2zM7.9%2017.8l-1.5%201l-.9.1c.3.3.9.6%201.3.3l1.4-1h.4l-.1-.2zm6.4%200l-.6.3l-.3%201.7c-.2%201.1-3.2.7-3.9.7c.2.2.5.4.8.4h2.5c.4%200%20.9-.3%201-.7l.3-1.7l.7-.4c-.1-.2-.3-.2-.5-.3%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.075%22%20d%3D%22M10.1%201.8c-.2%200-.6.3-.6.5L9.2%204c-.1.4-.7.5-1%20.5c-.7-.5-1.7-1.6-2.5-.8L3.9%205.5c-.2.2-.3.7-.1%201l1%201.4c0%20.3-.1.9-.5%201l-1.7.3c-.2%200-.4.3-.5.6c-.1.7-.4%203.4.6%203.6l1.8.3l.3.7c-.2.7-.9%201.2-1.1%201.9c0%202%204.6%201.7%205.9%201.5c3.7-.7%206.8-3.2%208.2-6.7c.5-1.1.7-2%20.5-3.2l.3-.5l-.1-1.6l-.2-1.2l-1-1c-.2-.2-.7-.3-1-.1l-1.4%201c-.2.2-.7-.2-.9-.3l-.3-1.8c-.1-.4-.6-.6-1-.6zm1%206.6c3.8-.5%204.6%205.2.9%205.7c-3.8.5-4.6-5.2-.9-5.7%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.42%22%20d%3D%22M10.12%201.6c-.43%200-.82.51-.89.9l-.25%201.52c-.03.15-.56.31-.69.38l.14.11c.15-.03.71-.06.75-.29l.3-1.7c.2-1.1%203.14-.76%203.94-.72c-.21-.11-.37-.22-.62-.22zM3.8%206.81c-.06-.31-.13-.65%200-.97c.16-.39%201.96-2.19%202.35-2.34c.32-.13.65-.06.96%200c-.32-.2-.61-.35-1.01-.25c-.5.12-2.37%201.96-2.52%202.46c-.14.43%200%20.75.22%201.1m12.28-3.38l-1.21.88c-.13.1-.35-.06-.47-.11l-.02.08l.62.26l1.4-.99c.25-.17.66-.13.92-.14c-.41-.2-.84-.28-1.24.02M4.7%207.99c-.12.24-.24.48-.38.69l-1.7.3c-.42.08-.74.63-.74%201.02v2.4c0%20.3.09.47.22.72l.01-3.15c.07-.26.23-.5.45-.66c.53-.37%201.42-.31%202.02-.47l.25-.55c-.04-.08-.09-.21-.13-.3m14.22.76v.09l.12.06l1.56.25l.11-.04c-.54-.27-1.19-.32-1.79-.36M14%209.98l.24%201.12c.06%201.45-1.06%202.78-2.54%202.84c-.5.02-.96-.13-1.42-.24c2.54%201.49%205.21-1.18%203.72-3.72m-9.48%204.1c.03.08.17.38.09.49l-.84%201.15c-.32.43-.28.85-.06%201.31c.01-.23-.04-.64.11-.85l1.02-1.48l-.22-.58zm4.57%204.51l-.06.11l.18%201.21c.03.2.11.33.2.5l.04-.11l-.25-1.56z%22%20class%3D%22wm-k%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-opacity%3D%22.92%22%20d%3D%22M10.32%202c-.22%200-.59.18-.63.42l-.28%201.66c-.09.52-.9.68-1.32.72l.41.27c.38.08%201.14-.3%201.21-.69l.28-1.66c.11-.66%202.78-.42%203.33-.42c-.15-.14-.25-.3-.49-.3zM4.29%206.74c-.07-.47-.01-.72.34-1.06l1.6-1.59c.22-.22.57-.13.81-.1c-.25-.21-.47-.41-.84-.33c-.34.07-2.16%201.9-2.24%202.24c-.08.36.12.59.33.84m9.8-2.14c.21.18.89.66%201.2.44l1.4-1.01l.56-.14c-.99-.78-1.49.68-2.35.88c-.23.05-.6-.13-.81-.17M5.1%207.79c-.04.41-.21%201.23-.72%201.32l-1.58.26c-.28.04-.5.38-.5.65v2.46c0%20.23.13.35.25.52l.07-.01c-.04-.6-.15-2.39.02-2.89c.07-.19.25-.4.46-.43l1.58-.26l.31-.16c.31-.59.56-.88.11-1.46m9.2%201.87c.05.17.12.37.2.55l.1-.11zm-9.4%204.13c.04.2.28.7.14.9l-.97%201.33c-.25.35-.1.65.12.93c.14-.8.78-1.35%201.18-2.05c-.04-.43-.2-.79-.47-1.11m5.1.19v.07l.37.24l.14-.09z%22%20class%3D%22wm-shine%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

给设置加一点动效

单文件 CSS 即可播放，无需任何依赖；描画动效仅对描边类图标生效。

呼吸

透明度往复渐变，适合状态提示与在线指示。

css呼吸动效样式

.icon-settings {
  animation: icon-breathe 1.8s ease-in-out infinite;
}

@keyframes icon-breathe {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}

旋转

匀速循环旋转，适合加载中场景。

css旋转动效样式

.icon-settings {
  animation: icon-spin 1.6s linear infinite;
}

@keyframes icon-spin {
  to { transform: rotate(360deg); }
}

SVG 健康报告

对源文件的客观技术指标，供工程侧评估引用方式。

文件体积

6.18 KB

6,333 字节

viewBox

0 0 24 24

矢量坐标系

图元总数

<path> ×13

风格

多色填充

填充跟随容器颜色

同时含 width/height 与 viewBox：可以只保留 viewBox，让图标跟随容器自适应缩放。文件体积 6.18 KB（6,333 字节），图元 13 个，风格为多色填充。

常见问题

关于设置图标的下载、商用与改色。

设置图标是什么？▾

它是 with icons Luxe（withicons-luxe）开源图标集中的 settings 图标，多色填充，viewBox 为 0 0 24 24，文件仅 6.18 KB，矢量格式可无损缩放到任意尺寸。

如何下载设置图标？▾

点击「下载与导出」中的 SVG 源文件按钮保存矢量文件；也可以按 512 / 256 / 128 / 64 / 32 / 16px 预设导出 PNG，或在输入框填 16~1024 之间的任意尺寸。需要 iOS、Android 全套尺寸时，用素材包生成器一键打包。

设置图标可以商用吗？▾

如何修改设置图标的颜色？▾

在「预览与场景」的色板中切换颜色，三底色与全部场景会实时跟随；点击任一相近图标可打开预览弹层，复制对应颜色的 SVG 源码或 PNG。也可以复制 SVG 源码后自行修改 fill 值。

设置 SVG 图标

下载 设置 图标

设置 的预览与使用场景