3rd-place-medal SVG 图标
noto-v13rd-place-medal
来自 Noto Emoji (v1) 开源图标集,矢量 SVG 可无损缩放到任意尺寸,支持在线改色、复制 React/Vue/HTML 代码。
- 图标 ID
- noto-v1:3rd-place-medal
- 中文名
- —
- 所属集合
- Noto Emoji (v1)
- 集合规模
- 2,162 枚
- 基础网格
- 16px
- 色彩
- 多色
- 开源协议
- Apache-2.0
- 作者
- Google Inc
noto-v13rd-place-medal
来自 Noto Emoji (v1) 开源图标集,矢量 SVG 可无损缩放到任意尺寸,支持在线改色、复制 React/Vue/HTML 代码。
SVG 矢量源文件,或 PNG 按 16~512 预设与 16~1024 自定义尺寸导出,任意尺寸边缘锐利。
PNG 由矢量源实时渲染,任意尺寸边缘锐利无锯齿;下载与预览均免费,无需注册。
切换预览颜色后,下方三底色、真实界面场景与各尺寸渲染会实时跟随。
内联 SVG、React、Vue 与 CSS mask 四种主流引用方式,代码基于当前源文件生成,复制即用。
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><defs><path id="SVG3rMndcyG" d="M0 0h128v128H0z"/></defs><clipPath id="SVGBOv6peZo"><use href="#SVG3rMndcyG"/></clipPath><g clip-path="url(#SVGBOv6peZo)"><path fill="#006ca2" d="M50.14 61.85h25.59L107.72 0H82.13z"/><path fill="#2f2f2f" d="M66.13 30.92L53.34 55.67l3.2 6.18h19.19l3.2-6.18z"/><path fill="#f79329" d="M77.77 76.78H52.18V61.85h25.59zm0-21.33H52.18a6.4 6.4 0 0 0-6.4 6.4v14.93c0 3.54 2.86 6.4 6.4 6.4h25.59c3.54 0 6.4-2.86 6.4-6.4V61.85c0-3.54-2.86-6.4-6.4-6.4"/><path fill="#f79329" d="M96.97 95.97c0 17.67-14.32 31.99-31.99 31.99s-31.99-14.32-31.99-31.99s14.32-31.99 31.99-31.99s31.99 14.33 31.99 31.99"/><path fill="#fff" d="M43.53 88.19c-.42 0-.84-.08-1.24-.26c-1.54-.66-2.28-2.45-1.68-4.01c.01-.03.02-.05.03-.07c.01-.05.01-.04.04-.08A22.8 22.8 0 0 1 56.56 70.4c.35-.08.72.09.88.42s.07.73-.22.96c-4.67 3.71-8.4 8.72-10.79 14.47c0 .01-.01.02-.01.02c0 .01 0 .01-.01.02c-.33.77-.94 1.37-1.72 1.67c-.37.16-.77.23-1.16.23"/><path fill="#006ca2" d="M77.86 61.85H52.27L20.28 0h25.59z"/><path fill="#ae3d09" d="M64.7 111.85h.16c1.81-.03 5.24-.43 7.86-2.78c2.18-1.96 3.19-4.64 2.78-7.36c-.39-2.53-1.98-4.68-4.41-6.01c2.33-1.75 3.73-3.94 3.97-6.22c.24-2.21-.63-4.41-2.5-6.37c-1.88-1.97-4.42-3.01-7.33-3.01c-4.49 0-8.62 2.37-9.87 4.09c-.11.14-.11.34-.01.5l2.79 4.03c.07.1.17.17.29.18c.11.02.24-.01.33-.09c.03-.02 3.06-2.51 5.65-2.51c1.18 0 2.05.52 2.67 1.58c.51.89.61 1.7.3 2.48c-.85 2.1-4.45 3.17-4.48 3.18c-.18.05-.31.22-.31.41v3.55c0 .2.13.37.33.41c.04.01 3.46.86 4.24 2.82c.31.77.15 1.64-.46 2.59c-.65 1-1.63 1.51-2.92 1.51c-2.5 0-5.56-1.9-6.9-3.09a.44.44 0 0 0-.33-.11c-.13.01-.23.08-.3.18l-2.79 4.03c-.11.16-.1.37.03.52c.17.23 4.73 5.49 11.21 5.49"/></g></svg>export function 3rdPlaceMedalIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width="1em"
height="1em"
viewBox="0 0 128 128"
fill="currentColor"
{...props}
dangerouslySetInnerHTML={{ __html: `<defs><path id="SVG3rMndcyG" d="M0 0h128v128H0z"/></defs><clipPath id="SVGBOv6peZo"><use href="#SVG3rMndcyG"/></clipPath><g clip-path="url(#SVGBOv6peZo)"><path fill="#006ca2" d="M50.14 61.85h25.59L107.72 0H82.13z"/><path fill="#2f2f2f" d="M66.13 30.92L53.34 55.67l3.2 6.18h19.19l3.2-6.18z"/><path fill="#f79329" d="M77.77 76.78H52.18V61.85h25.59zm0-21.33H52.18a6.4 6.4 0 0 0-6.4 6.4v14.93c0 3.54 2.86 6.4 6.4 6.4h25.59c3.54 0 6.4-2.86 6.4-6.4V61.85c0-3.54-2.86-6.4-6.4-6.4"/><path fill="#f79329" d="M96.97 95.97c0 17.67-14.32 31.99-31.99 31.99s-31.99-14.32-31.99-31.99s14.32-31.99 31.99-31.99s31.99 14.33 31.99 31.99"/><path fill="#fff" d="M43.53 88.19c-.42 0-.84-.08-1.24-.26c-1.54-.66-2.28-2.45-1.68-4.01c.01-.03.02-.05.03-.07c.01-.05.01-.04.04-.08A22.8 22.8 0 0 1 56.56 70.4c.35-.08.72.09.88.42s.07.73-.22.96c-4.67 3.71-8.4 8.72-10.79 14.47c0 .01-.01.02-.01.02c0 .01 0 .01-.01.02c-.33.77-.94 1.37-1.72 1.67c-.37.16-.77.23-1.16.23"/><path fill="#006ca2" d="M77.86 61.85H52.27L20.28 0h25.59z"/><path fill="#ae3d09" d="M64.7 111.85h.16c1.81-.03 5.24-.43 7.86-2.78c2.18-1.96 3.19-4.64 2.78-7.36c-.39-2.53-1.98-4.68-4.41-6.01c2.33-1.75 3.73-3.94 3.97-6.22c.24-2.21-.63-4.41-2.5-6.37c-1.88-1.97-4.42-3.01-7.33-3.01c-4.49 0-8.62 2.37-9.87 4.09c-.11.14-.11.34-.01.5l2.79 4.03c.07.1.17.17.29.18c.11.02.24-.01.33-.09c.03-.02 3.06-2.51 5.65-2.51c1.18 0 2.05.52 2.67 1.58c.51.89.61 1.7.3 2.48c-.85 2.1-4.45 3.17-4.48 3.18c-.18.05-.31.22-.31.41v3.55c0 .2.13.37.33.41c.04.01 3.46.86 4.24 2.82c.31.77.15 1.64-.46 2.59c-.65 1-1.63 1.51-2.92 1.51c-2.5 0-5.56-1.9-6.9-3.09a.44.44 0 0 0-.33-.11c-.13.01-.23.08-.3.18l-2.79 4.03c-.11.16-.1.37.03.52c.17.23 4.73 5.49 11.21 5.49"/></g>` }}
/>
);
}<template>
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128" fill="currentColor" v-html="body"></svg>
</template>
<script setup>
const body = `<defs><path id="SVG3rMndcyG" d="M0 0h128v128H0z"/></defs><clipPath id="SVGBOv6peZo"><use href="#SVG3rMndcyG"/></clipPath><g clip-path="url(#SVGBOv6peZo)"><path fill="#006ca2" d="M50.14 61.85h25.59L107.72 0H82.13z"/><path fill="#2f2f2f" d="M66.13 30.92L53.34 55.67l3.2 6.18h19.19l3.2-6.18z"/><path fill="#f79329" d="M77.77 76.78H52.18V61.85h25.59zm0-21.33H52.18a6.4 6.4 0 0 0-6.4 6.4v14.93c0 3.54 2.86 6.4 6.4 6.4h25.59c3.54 0 6.4-2.86 6.4-6.4V61.85c0-3.54-2.86-6.4-6.4-6.4"/><path fill="#f79329" d="M96.97 95.97c0 17.67-14.32 31.99-31.99 31.99s-31.99-14.32-31.99-31.99s14.32-31.99 31.99-31.99s31.99 14.33 31.99 31.99"/><path fill="#fff" d="M43.53 88.19c-.42 0-.84-.08-1.24-.26c-1.54-.66-2.28-2.45-1.68-4.01c.01-.03.02-.05.03-.07c.01-.05.01-.04.04-.08A22.8 22.8 0 0 1 56.56 70.4c.35-.08.72.09.88.42s.07.73-.22.96c-4.67 3.71-8.4 8.72-10.79 14.47c0 .01-.01.02-.01.02c0 .01 0 .01-.01.02c-.33.77-.94 1.37-1.72 1.67c-.37.16-.77.23-1.16.23"/><path fill="#006ca2" d="M77.86 61.85H52.27L20.28 0h25.59z"/><path fill="#ae3d09" d="M64.7 111.85h.16c1.81-.03 5.24-.43 7.86-2.78c2.18-1.96 3.19-4.64 2.78-7.36c-.39-2.53-1.98-4.68-4.41-6.01c2.33-1.75 3.73-3.94 3.97-6.22c.24-2.21-.63-4.41-2.5-6.37c-1.88-1.97-4.42-3.01-7.33-3.01c-4.49 0-8.62 2.37-9.87 4.09c-.11.14-.11.34-.01.5l2.79 4.03c.07.1.17.17.29.18c.11.02.24-.01.33-.09c.03-.02 3.06-2.51 5.65-2.51c1.18 0 2.05.52 2.67 1.58c.51.89.61 1.7.3 2.48c-.85 2.1-4.45 3.17-4.48 3.18c-.18.05-.31.22-.31.41v3.55c0 .2.13.37.33.41c.04.01 3.46.86 4.24 2.82c.31.77.15 1.64-.46 2.59c-.65 1-1.63 1.51-2.92 1.51c-2.5 0-5.56-1.9-6.9-3.09a.44.44 0 0 0-.33-.11c-.13.01-.23.08-.3.18l-2.79 4.03c-.11.16-.1.37.03.52c.17.23 4.73 5.49 11.21 5.49"/></g>`;
</script>.3rd-place-medal {
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%20128%20128%22%3E%3Cdefs%3E%3Cpath%20id%3D%22SVG3rMndcyG%22%20d%3D%22M0%200h128v128H0z%22%2F%3E%3C%2Fdefs%3E%3CclipPath%20id%3D%22SVGBOv6peZo%22%3E%3Cuse%20href%3D%22%23SVG3rMndcyG%22%2F%3E%3C%2FclipPath%3E%3Cg%20clip-path%3D%22url(%23SVGBOv6peZo)%22%3E%3Cpath%20fill%3D%22%23006ca2%22%20d%3D%22M50.14%2061.85h25.59L107.72%200H82.13z%22%2F%3E%3Cpath%20fill%3D%22%232f2f2f%22%20d%3D%22M66.13%2030.92L53.34%2055.67l3.2%206.18h19.19l3.2-6.18z%22%2F%3E%3Cpath%20fill%3D%22%23f79329%22%20d%3D%22M77.77%2076.78H52.18V61.85h25.59zm0-21.33H52.18a6.4%206.4%200%200%200-6.4%206.4v14.93c0%203.54%202.86%206.4%206.4%206.4h25.59c3.54%200%206.4-2.86%206.4-6.4V61.85c0-3.54-2.86-6.4-6.4-6.4%22%2F%3E%3Cpath%20fill%3D%22%23f79329%22%20d%3D%22M96.97%2095.97c0%2017.67-14.32%2031.99-31.99%2031.99s-31.99-14.32-31.99-31.99s14.32-31.99%2031.99-31.99s31.99%2014.33%2031.99%2031.99%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M43.53%2088.19c-.42%200-.84-.08-1.24-.26c-1.54-.66-2.28-2.45-1.68-4.01c.01-.03.02-.05.03-.07c.01-.05.01-.04.04-.08A22.8%2022.8%200%200%201%2056.56%2070.4c.35-.08.72.09.88.42s.07.73-.22.96c-4.67%203.71-8.4%208.72-10.79%2014.47c0%20.01-.01.02-.01.02c0%20.01%200%20.01-.01.02c-.33.77-.94%201.37-1.72%201.67c-.37.16-.77.23-1.16.23%22%2F%3E%3Cpath%20fill%3D%22%23006ca2%22%20d%3D%22M77.86%2061.85H52.27L20.28%200h25.59z%22%2F%3E%3Cpath%20fill%3D%22%23ae3d09%22%20d%3D%22M64.7%20111.85h.16c1.81-.03%205.24-.43%207.86-2.78c2.18-1.96%203.19-4.64%202.78-7.36c-.39-2.53-1.98-4.68-4.41-6.01c2.33-1.75%203.73-3.94%203.97-6.22c.24-2.21-.63-4.41-2.5-6.37c-1.88-1.97-4.42-3.01-7.33-3.01c-4.49%200-8.62%202.37-9.87%204.09c-.11.14-.11.34-.01.5l2.79%204.03c.07.1.17.17.29.18c.11.02.24-.01.33-.09c.03-.02%203.06-2.51%205.65-2.51c1.18%200%202.05.52%202.67%201.58c.51.89.61%201.7.3%202.48c-.85%202.1-4.45%203.17-4.48%203.18c-.18.05-.31.22-.31.41v3.55c0%20.2.13.37.33.41c.04.01%203.46.86%204.24%202.82c.31.77.15%201.64-.46%202.59c-.65%201-1.63%201.51-2.92%201.51c-2.5%200-5.56-1.9-6.9-3.09a.44.44%200%200%200-.33-.11c-.13.01-.23.08-.3.18l-2.79%204.03c-.11.16-.1.37.03.52c.17.23%204.73%205.49%2011.21%205.49%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%20128%20128%22%3E%3Cdefs%3E%3Cpath%20id%3D%22SVG3rMndcyG%22%20d%3D%22M0%200h128v128H0z%22%2F%3E%3C%2Fdefs%3E%3CclipPath%20id%3D%22SVGBOv6peZo%22%3E%3Cuse%20href%3D%22%23SVG3rMndcyG%22%2F%3E%3C%2FclipPath%3E%3Cg%20clip-path%3D%22url(%23SVGBOv6peZo)%22%3E%3Cpath%20fill%3D%22%23006ca2%22%20d%3D%22M50.14%2061.85h25.59L107.72%200H82.13z%22%2F%3E%3Cpath%20fill%3D%22%232f2f2f%22%20d%3D%22M66.13%2030.92L53.34%2055.67l3.2%206.18h19.19l3.2-6.18z%22%2F%3E%3Cpath%20fill%3D%22%23f79329%22%20d%3D%22M77.77%2076.78H52.18V61.85h25.59zm0-21.33H52.18a6.4%206.4%200%200%200-6.4%206.4v14.93c0%203.54%202.86%206.4%206.4%206.4h25.59c3.54%200%206.4-2.86%206.4-6.4V61.85c0-3.54-2.86-6.4-6.4-6.4%22%2F%3E%3Cpath%20fill%3D%22%23f79329%22%20d%3D%22M96.97%2095.97c0%2017.67-14.32%2031.99-31.99%2031.99s-31.99-14.32-31.99-31.99s14.32-31.99%2031.99-31.99s31.99%2014.33%2031.99%2031.99%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M43.53%2088.19c-.42%200-.84-.08-1.24-.26c-1.54-.66-2.28-2.45-1.68-4.01c.01-.03.02-.05.03-.07c.01-.05.01-.04.04-.08A22.8%2022.8%200%200%201%2056.56%2070.4c.35-.08.72.09.88.42s.07.73-.22.96c-4.67%203.71-8.4%208.72-10.79%2014.47c0%20.01-.01.02-.01.02c0%20.01%200%20.01-.01.02c-.33.77-.94%201.37-1.72%201.67c-.37.16-.77.23-1.16.23%22%2F%3E%3Cpath%20fill%3D%22%23006ca2%22%20d%3D%22M77.86%2061.85H52.27L20.28%200h25.59z%22%2F%3E%3Cpath%20fill%3D%22%23ae3d09%22%20d%3D%22M64.7%20111.85h.16c1.81-.03%205.24-.43%207.86-2.78c2.18-1.96%203.19-4.64%202.78-7.36c-.39-2.53-1.98-4.68-4.41-6.01c2.33-1.75%203.73-3.94%203.97-6.22c.24-2.21-.63-4.41-2.5-6.37c-1.88-1.97-4.42-3.01-7.33-3.01c-4.49%200-8.62%202.37-9.87%204.09c-.11.14-.11.34-.01.5l2.79%204.03c.07.1.17.17.29.18c.11.02.24-.01.33-.09c.03-.02%203.06-2.51%205.65-2.51c1.18%200%202.05.52%202.67%201.58c.51.89.61%201.7.3%202.48c-.85%202.1-4.45%203.17-4.48%203.18c-.18.05-.31.22-.31.41v3.55c0%20.2.13.37.33.41c.04.01%203.46.86%204.24%202.82c.31.77.15%201.64-.46%202.59c-.65%201-1.63%201.51-2.92%201.51c-2.5%200-5.56-1.9-6.9-3.09a.44.44%200%200%200-.33-.11c-.13.01-.23.08-.3.18l-2.79%204.03c-.11.16-.1.37.03.52c.17.23%204.73%205.49%2011.21%205.49%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}单文件 CSS 即可播放,无需任何依赖;描画动效仅对描边类图标生效。
透明度往复渐变,适合状态提示与在线指示。
.icon-3rd-place-medal {
animation: icon-breathe 1.8s ease-in-out infinite;
}
@keyframes icon-breathe {
0%, 100% { opacity: 1; }
50% { opacity: 0.35; }
}匀速循环旋转,适合加载中场景。
.icon-3rd-place-medal {
animation: icon-spin 1.6s linear infinite;
}
@keyframes icon-spin {
to { transform: rotate(360deg); }
}对源文件的客观技术指标,供工程侧评估引用方式。
文件体积
1.72 KB
1,758 字节
viewBox
0 0 128 128
矢量坐标系
图元总数
8
<path> ×8
风格
多色填充
填充跟随容器颜色
同时含 width/height 与 viewBox:可以只保留 viewBox,让图标跟随容器自适应缩放。 文件体积 1.72 KB(1,758 字节),图元 8 个,风格为多色填充。
关于 3rd-place-medal 图标的下载、商用与改色。
它是 Noto Emoji (v1)(noto-v1)开源图标集中的 3rd-place-medal 图标,多色填充,viewBox 为 0 0 128 128,文件仅 1.72 KB,矢量格式可无损缩放到任意尺寸。
点击「下载与导出」中的 SVG 源文件按钮保存矢量文件;也可以按 512 / 256 / 128 / 64 / 32 / 16px 预设导出 PNG,或在输入框填 16~1024 之间的任意尺寸。需要 iOS、Android 全套尺寸时,用素材包生成器一键打包。
该图标采用 Apache 2.0(Apache-2.0) 开源协议,通常允许在遵守协议的前提下免费使用,常见要求是保留作者版权声明。商用前建议阅读协议原文确认。
在「预览与场景」的色板中切换颜色,三底色与全部场景会实时跟随;点击任一相近图标可打开预览弹层,复制对应颜色的 SVG 源码或 PNG。也可以复制 SVG 源码后自行修改 fill 值。