找找图标
panda 图标

panda SVG 图标

logospanda

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

图标 ID
logos:panda
中文名
—
所属集合
SVG Logos
集合规模
2,043 枚
基础网格
—
色彩
多色
开源协议
CC0-1.0
作者
Gil Barbara

下载 panda 图标

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

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

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

panda 的预览与使用场景

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

预览颜色
panda 图标 浅色背景预览浅色背景
panda 图标 深色背景预览深色背景
panda 图标 灰底融入预览灰底融入

在真实界面里长这样

继续按钮内 · 主操作
搜索panda…输入框 · 前缀图标
panda导航菜单 · 选中态
暂无内容空状态 · 引导提示
9:41panda App 图标pandapandaspandacssbigpandapandas-iconpandacss-icon手机桌面 · App 图标
pandalogos.design/icons/panda浏览器 · 标签页与站点图标

各尺寸下的可读性

panda 图标 24px 渲染24pxpanda 图标 32px 渲染32pxpanda 图标 48px 渲染48pxpanda 图标 64px 渲染64pxpanda 图标 96px 渲染96pxpanda 图标 128px 渲染128px

复制 panda 图标代码

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

svgSVG 源码（内联 HTML）
<svg xmlns="http://www.w3.org/2000/svg" width="1.27em" height="1em" viewBox="0 0 256 203"><path fill="#090b08" d="M256 39.788c0-20.403-14.696-37.007-35.105-37.007c-12.06 0-20.814 4.191-26.34 11.08c-1.033.786-1.938 1.69-2.838 2.607C173.904 6.078 152.134.07 128.115 0C103.177.068 81.12 5.888 63.324 16.159C57.661 7.848 47.783 2.781 34.398 2.781C13.989 2.781 0 19.385 0 39.788C0 55.435 7.682 67.87 19.476 73.492c-1.815 7.387-2.865 15.139-2.865 23.29c0 59.075 48.976 105.969 111.498 105.969h.059c60.436 0 111.498-48.816 111.498-105.916c0-8.333-1.227-16.312-3.322-23.939C247.966 66.997 256 54.859 256 39.788"/><path fill="#fff" d="M226.806 97.41c0 49.378-45.422 91.504-98.875 91.504s-98.883-40.032-98.883-89.411c0-49.385 45.429-89.411 98.883-89.411s98.875 37.933 98.875 87.318"/><path fill="#090b08" d="M107.819 78.44c-2.266 17.232-13.732 29.934-25.594 28.368c-11.863-1.565-19.643-16.803-17.371-34.035s13.731-29.933 25.6-28.368c11.863 1.559 19.643 16.796 17.365 34.035"/><path fill="#fff" d="M98.38 62.067c0 5.138-4.167 9.306-9.306 9.306s-9.306-4.168-9.306-9.306c0-5.139 4.167-9.307 9.306-9.307s9.306 4.168 9.306 9.307"/><path fill="#090b08" d="M147.911 78.44c2.272 17.232 13.731 29.934 25.594 28.368c11.869-1.565 19.643-16.803 17.371-34.035s-13.732-29.933-25.595-28.368c-11.868 1.559-19.642 16.796-17.37 34.035"/><path fill="#fff" d="M157.356 62.067a9.304 9.304 0 0 0 9.306 9.306c5.139 0 9.3-4.168 9.3-9.306c0-5.139-4.161-9.307-9.3-9.307a9.304 9.304 0 0 0-9.306 9.307"/><path fill="#090b08" d="M134.853 138.443v-10.208c0-.554-.053-1.078-.167-1.556c7.579-1.457 13.079-5.528 13.079-10.379c0-4.756-1.057-8.805-8.401-10.344c-2.035-.422-8.415-.654-10.7-.654c-2.186 0-8.474.212-10.429.601c-7.491 1.487-8.679 5.582-8.679 10.397c0 6.007 8.385 10.871 18.788 10.972c-.04.316-.096.621-.096.963v10.683c-15.285-.189-29.511-10.613-29.511-3.649c0 7.034 15.138 13.699 30.581 13.699s27.959-5.7 27.959-12.735c0-6.069-9.814.337-22.424 2.21"/><path fill="#e7ebe0" d="M136.946 114.206c0 1.962-4.861 3.56-8.282 3.56s-8.289-1.598-8.289-3.56c0-1.565 2.476-2.893 4.907-3.375c.634-.126 2.675-.192 3.382-.192c.74 0 2.807.08 3.467.212c2.378.495 4.815 1.809 4.815 3.355"/><path fill="#e1dedc" d="M127.931 10.092c-53.454 0-98.883 40.026-98.883 89.411c0 49.379 45.429 89.411 98.883 89.411c-2.134 0-4.254-.086-6.354-.211q4.179-.26 8.269-.846c-46.756-6.578-84.047-43.619-84.047-88.354c0-44.86 37.496-81.98 84.437-88.4a113 113 0 0 0-8.514-.812c2.061-.119 4.128-.199 6.209-.199"/><path fill="#f1efee" d="M127.931 10.092c2.86 0 5.693.133 8.507.344c-2.081.165-4.155.383-6.202.667c46.743 6.262 84.008 41.578 84.008 86.307c0 44.847-37.476 83.691-84.398 90.447q3.142.436 6.334.694c-2.728.224-5.475.363-8.249.363c53.453 0 98.875-42.126 98.875-91.504c0-49.385-45.422-87.318-98.875-87.318"/><path fill="#d3d0cd" d="M129.846 187.857q-4.09.587-8.269.846c2.1.125 4.22.211 6.354.211c2.774 0 5.521-.139 8.249-.363q-3.192-.258-6.334-.694m-1.915-177.765c-2.081 0-4.148.08-6.209.199q4.302.248 8.514.812c2.047-.284 4.121-.502 6.202-.667a114 114 0 0 0-8.507-.344"/><path fill="#fff" d="M229.008 54.533c4.09-3.612 6.722-8.837 6.722-14.725c0-10.885-8.824-19.716-19.716-19.716c-4.74 0-9.031 1.742-12.431 4.529c10.633 8.313 19.267 18.423 25.425 29.912m-202.959.827c5.817-11.823 14.191-22.108 24.688-30.52c-3.439-2.919-7.835-4.748-12.699-4.748c-10.885 0-19.716 8.831-19.716 19.716c0 6.356 3.059 11.947 7.727 15.552"/></svg>
reactReact 组件（TSX）
export function PandaIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="1em"
      height="1em"
      viewBox="0 0 256 203"
      fill="currentColor"
      {...props}
      dangerouslySetInnerHTML={{ __html: `<path fill="#090b08" d="M256 39.788c0-20.403-14.696-37.007-35.105-37.007c-12.06 0-20.814 4.191-26.34 11.08c-1.033.786-1.938 1.69-2.838 2.607C173.904 6.078 152.134.07 128.115 0C103.177.068 81.12 5.888 63.324 16.159C57.661 7.848 47.783 2.781 34.398 2.781C13.989 2.781 0 19.385 0 39.788C0 55.435 7.682 67.87 19.476 73.492c-1.815 7.387-2.865 15.139-2.865 23.29c0 59.075 48.976 105.969 111.498 105.969h.059c60.436 0 111.498-48.816 111.498-105.916c0-8.333-1.227-16.312-3.322-23.939C247.966 66.997 256 54.859 256 39.788"/><path fill="#fff" d="M226.806 97.41c0 49.378-45.422 91.504-98.875 91.504s-98.883-40.032-98.883-89.411c0-49.385 45.429-89.411 98.883-89.411s98.875 37.933 98.875 87.318"/><path fill="#090b08" d="M107.819 78.44c-2.266 17.232-13.732 29.934-25.594 28.368c-11.863-1.565-19.643-16.803-17.371-34.035s13.731-29.933 25.6-28.368c11.863 1.559 19.643 16.796 17.365 34.035"/><path fill="#fff" d="M98.38 62.067c0 5.138-4.167 9.306-9.306 9.306s-9.306-4.168-9.306-9.306c0-5.139 4.167-9.307 9.306-9.307s9.306 4.168 9.306 9.307"/><path fill="#090b08" d="M147.911 78.44c2.272 17.232 13.731 29.934 25.594 28.368c11.869-1.565 19.643-16.803 17.371-34.035s-13.732-29.933-25.595-28.368c-11.868 1.559-19.642 16.796-17.37 34.035"/><path fill="#fff" d="M157.356 62.067a9.304 9.304 0 0 0 9.306 9.306c5.139 0 9.3-4.168 9.3-9.306c0-5.139-4.161-9.307-9.3-9.307a9.304 9.304 0 0 0-9.306 9.307"/><path fill="#090b08" d="M134.853 138.443v-10.208c0-.554-.053-1.078-.167-1.556c7.579-1.457 13.079-5.528 13.079-10.379c0-4.756-1.057-8.805-8.401-10.344c-2.035-.422-8.415-.654-10.7-.654c-2.186 0-8.474.212-10.429.601c-7.491 1.487-8.679 5.582-8.679 10.397c0 6.007 8.385 10.871 18.788 10.972c-.04.316-.096.621-.096.963v10.683c-15.285-.189-29.511-10.613-29.511-3.649c0 7.034 15.138 13.699 30.581 13.699s27.959-5.7 27.959-12.735c0-6.069-9.814.337-22.424 2.21"/><path fill="#e7ebe0" d="M136.946 114.206c0 1.962-4.861 3.56-8.282 3.56s-8.289-1.598-8.289-3.56c0-1.565 2.476-2.893 4.907-3.375c.634-.126 2.675-.192 3.382-.192c.74 0 2.807.08 3.467.212c2.378.495 4.815 1.809 4.815 3.355"/><path fill="#e1dedc" d="M127.931 10.092c-53.454 0-98.883 40.026-98.883 89.411c0 49.379 45.429 89.411 98.883 89.411c-2.134 0-4.254-.086-6.354-.211q4.179-.26 8.269-.846c-46.756-6.578-84.047-43.619-84.047-88.354c0-44.86 37.496-81.98 84.437-88.4a113 113 0 0 0-8.514-.812c2.061-.119 4.128-.199 6.209-.199"/><path fill="#f1efee" d="M127.931 10.092c2.86 0 5.693.133 8.507.344c-2.081.165-4.155.383-6.202.667c46.743 6.262 84.008 41.578 84.008 86.307c0 44.847-37.476 83.691-84.398 90.447q3.142.436 6.334.694c-2.728.224-5.475.363-8.249.363c53.453 0 98.875-42.126 98.875-91.504c0-49.385-45.422-87.318-98.875-87.318"/><path fill="#d3d0cd" d="M129.846 187.857q-4.09.587-8.269.846c2.1.125 4.22.211 6.354.211c2.774 0 5.521-.139 8.249-.363q-3.192-.258-6.334-.694m-1.915-177.765c-2.081 0-4.148.08-6.209.199q4.302.248 8.514.812c2.047-.284 4.121-.502 6.202-.667a114 114 0 0 0-8.507-.344"/><path fill="#fff" d="M229.008 54.533c4.09-3.612 6.722-8.837 6.722-14.725c0-10.885-8.824-19.716-19.716-19.716c-4.74 0-9.031 1.742-12.431 4.529c10.633 8.313 19.267 18.423 25.425 29.912m-202.959.827c5.817-11.823 14.191-22.108 24.688-30.52c-3.439-2.919-7.835-4.748-12.699-4.748c-10.885 0-19.716 8.831-19.716 19.716c0 6.356 3.059 11.947 7.727 15.552"/>` }}
    />
  );
}
vueVue 3 组件
<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 203" fill="currentColor" v-html="body"></svg>
</template>

<script setup>
const body = `<path fill="#090b08" d="M256 39.788c0-20.403-14.696-37.007-35.105-37.007c-12.06 0-20.814 4.191-26.34 11.08c-1.033.786-1.938 1.69-2.838 2.607C173.904 6.078 152.134.07 128.115 0C103.177.068 81.12 5.888 63.324 16.159C57.661 7.848 47.783 2.781 34.398 2.781C13.989 2.781 0 19.385 0 39.788C0 55.435 7.682 67.87 19.476 73.492c-1.815 7.387-2.865 15.139-2.865 23.29c0 59.075 48.976 105.969 111.498 105.969h.059c60.436 0 111.498-48.816 111.498-105.916c0-8.333-1.227-16.312-3.322-23.939C247.966 66.997 256 54.859 256 39.788"/><path fill="#fff" d="M226.806 97.41c0 49.378-45.422 91.504-98.875 91.504s-98.883-40.032-98.883-89.411c0-49.385 45.429-89.411 98.883-89.411s98.875 37.933 98.875 87.318"/><path fill="#090b08" d="M107.819 78.44c-2.266 17.232-13.732 29.934-25.594 28.368c-11.863-1.565-19.643-16.803-17.371-34.035s13.731-29.933 25.6-28.368c11.863 1.559 19.643 16.796 17.365 34.035"/><path fill="#fff" d="M98.38 62.067c0 5.138-4.167 9.306-9.306 9.306s-9.306-4.168-9.306-9.306c0-5.139 4.167-9.307 9.306-9.307s9.306 4.168 9.306 9.307"/><path fill="#090b08" d="M147.911 78.44c2.272 17.232 13.731 29.934 25.594 28.368c11.869-1.565 19.643-16.803 17.371-34.035s-13.732-29.933-25.595-28.368c-11.868 1.559-19.642 16.796-17.37 34.035"/><path fill="#fff" d="M157.356 62.067a9.304 9.304 0 0 0 9.306 9.306c5.139 0 9.3-4.168 9.3-9.306c0-5.139-4.161-9.307-9.3-9.307a9.304 9.304 0 0 0-9.306 9.307"/><path fill="#090b08" d="M134.853 138.443v-10.208c0-.554-.053-1.078-.167-1.556c7.579-1.457 13.079-5.528 13.079-10.379c0-4.756-1.057-8.805-8.401-10.344c-2.035-.422-8.415-.654-10.7-.654c-2.186 0-8.474.212-10.429.601c-7.491 1.487-8.679 5.582-8.679 10.397c0 6.007 8.385 10.871 18.788 10.972c-.04.316-.096.621-.096.963v10.683c-15.285-.189-29.511-10.613-29.511-3.649c0 7.034 15.138 13.699 30.581 13.699s27.959-5.7 27.959-12.735c0-6.069-9.814.337-22.424 2.21"/><path fill="#e7ebe0" d="M136.946 114.206c0 1.962-4.861 3.56-8.282 3.56s-8.289-1.598-8.289-3.56c0-1.565 2.476-2.893 4.907-3.375c.634-.126 2.675-.192 3.382-.192c.74 0 2.807.08 3.467.212c2.378.495 4.815 1.809 4.815 3.355"/><path fill="#e1dedc" d="M127.931 10.092c-53.454 0-98.883 40.026-98.883 89.411c0 49.379 45.429 89.411 98.883 89.411c-2.134 0-4.254-.086-6.354-.211q4.179-.26 8.269-.846c-46.756-6.578-84.047-43.619-84.047-88.354c0-44.86 37.496-81.98 84.437-88.4a113 113 0 0 0-8.514-.812c2.061-.119 4.128-.199 6.209-.199"/><path fill="#f1efee" d="M127.931 10.092c2.86 0 5.693.133 8.507.344c-2.081.165-4.155.383-6.202.667c46.743 6.262 84.008 41.578 84.008 86.307c0 44.847-37.476 83.691-84.398 90.447q3.142.436 6.334.694c-2.728.224-5.475.363-8.249.363c53.453 0 98.875-42.126 98.875-91.504c0-49.385-45.422-87.318-98.875-87.318"/><path fill="#d3d0cd" d="M129.846 187.857q-4.09.587-8.269.846c2.1.125 4.22.211 6.354.211c2.774 0 5.521-.139 8.249-.363q-3.192-.258-6.334-.694m-1.915-177.765c-2.081 0-4.148.08-6.209.199q4.302.248 8.514.812c2.047-.284 4.121-.502 6.202-.667a114 114 0 0 0-8.507-.344"/><path fill="#fff" d="M229.008 54.533c4.09-3.612 6.722-8.837 6.722-14.725c0-10.885-8.824-19.716-19.716-19.716c-4.74 0-9.031 1.742-12.431 4.529c10.633 8.313 19.267 18.423 25.425 29.912m-202.959.827c5.817-11.823 14.191-22.108 24.688-30.52c-3.439-2.919-7.835-4.748-12.699-4.748c-10.885 0-19.716 8.831-19.716 19.716c0 6.356 3.059 11.947 7.727 15.552"/>`;
</script>
cssCSS mask（随 currentColor 改色）
.panda {
  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%221.27em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20203%22%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M256%2039.788c0-20.403-14.696-37.007-35.105-37.007c-12.06%200-20.814%204.191-26.34%2011.08c-1.033.786-1.938%201.69-2.838%202.607C173.904%206.078%20152.134.07%20128.115%200C103.177.068%2081.12%205.888%2063.324%2016.159C57.661%207.848%2047.783%202.781%2034.398%202.781C13.989%202.781%200%2019.385%200%2039.788C0%2055.435%207.682%2067.87%2019.476%2073.492c-1.815%207.387-2.865%2015.139-2.865%2023.29c0%2059.075%2048.976%20105.969%20111.498%20105.969h.059c60.436%200%20111.498-48.816%20111.498-105.916c0-8.333-1.227-16.312-3.322-23.939C247.966%2066.997%20256%2054.859%20256%2039.788%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M226.806%2097.41c0%2049.378-45.422%2091.504-98.875%2091.504s-98.883-40.032-98.883-89.411c0-49.385%2045.429-89.411%2098.883-89.411s98.875%2037.933%2098.875%2087.318%22%2F%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M107.819%2078.44c-2.266%2017.232-13.732%2029.934-25.594%2028.368c-11.863-1.565-19.643-16.803-17.371-34.035s13.731-29.933%2025.6-28.368c11.863%201.559%2019.643%2016.796%2017.365%2034.035%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M98.38%2062.067c0%205.138-4.167%209.306-9.306%209.306s-9.306-4.168-9.306-9.306c0-5.139%204.167-9.307%209.306-9.307s9.306%204.168%209.306%209.307%22%2F%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M147.911%2078.44c2.272%2017.232%2013.731%2029.934%2025.594%2028.368c11.869-1.565%2019.643-16.803%2017.371-34.035s-13.732-29.933-25.595-28.368c-11.868%201.559-19.642%2016.796-17.37%2034.035%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M157.356%2062.067a9.304%209.304%200%200%200%209.306%209.306c5.139%200%209.3-4.168%209.3-9.306c0-5.139-4.161-9.307-9.3-9.307a9.304%209.304%200%200%200-9.306%209.307%22%2F%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M134.853%20138.443v-10.208c0-.554-.053-1.078-.167-1.556c7.579-1.457%2013.079-5.528%2013.079-10.379c0-4.756-1.057-8.805-8.401-10.344c-2.035-.422-8.415-.654-10.7-.654c-2.186%200-8.474.212-10.429.601c-7.491%201.487-8.679%205.582-8.679%2010.397c0%206.007%208.385%2010.871%2018.788%2010.972c-.04.316-.096.621-.096.963v10.683c-15.285-.189-29.511-10.613-29.511-3.649c0%207.034%2015.138%2013.699%2030.581%2013.699s27.959-5.7%2027.959-12.735c0-6.069-9.814.337-22.424%202.21%22%2F%3E%3Cpath%20fill%3D%22%23e7ebe0%22%20d%3D%22M136.946%20114.206c0%201.962-4.861%203.56-8.282%203.56s-8.289-1.598-8.289-3.56c0-1.565%202.476-2.893%204.907-3.375c.634-.126%202.675-.192%203.382-.192c.74%200%202.807.08%203.467.212c2.378.495%204.815%201.809%204.815%203.355%22%2F%3E%3Cpath%20fill%3D%22%23e1dedc%22%20d%3D%22M127.931%2010.092c-53.454%200-98.883%2040.026-98.883%2089.411c0%2049.379%2045.429%2089.411%2098.883%2089.411c-2.134%200-4.254-.086-6.354-.211q4.179-.26%208.269-.846c-46.756-6.578-84.047-43.619-84.047-88.354c0-44.86%2037.496-81.98%2084.437-88.4a113%20113%200%200%200-8.514-.812c2.061-.119%204.128-.199%206.209-.199%22%2F%3E%3Cpath%20fill%3D%22%23f1efee%22%20d%3D%22M127.931%2010.092c2.86%200%205.693.133%208.507.344c-2.081.165-4.155.383-6.202.667c46.743%206.262%2084.008%2041.578%2084.008%2086.307c0%2044.847-37.476%2083.691-84.398%2090.447q3.142.436%206.334.694c-2.728.224-5.475.363-8.249.363c53.453%200%2098.875-42.126%2098.875-91.504c0-49.385-45.422-87.318-98.875-87.318%22%2F%3E%3Cpath%20fill%3D%22%23d3d0cd%22%20d%3D%22M129.846%20187.857q-4.09.587-8.269.846c2.1.125%204.22.211%206.354.211c2.774%200%205.521-.139%208.249-.363q-3.192-.258-6.334-.694m-1.915-177.765c-2.081%200-4.148.08-6.209.199q4.302.248%208.514.812c2.047-.284%204.121-.502%206.202-.667a114%20114%200%200%200-8.507-.344%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M229.008%2054.533c4.09-3.612%206.722-8.837%206.722-14.725c0-10.885-8.824-19.716-19.716-19.716c-4.74%200-9.031%201.742-12.431%204.529c10.633%208.313%2019.267%2018.423%2025.425%2029.912m-202.959.827c5.817-11.823%2014.191-22.108%2024.688-30.52c-3.439-2.919-7.835-4.748-12.699-4.748c-10.885%200-19.716%208.831-19.716%2019.716c0%206.356%203.059%2011.947%207.727%2015.552%22%2F%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%221.27em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20203%22%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M256%2039.788c0-20.403-14.696-37.007-35.105-37.007c-12.06%200-20.814%204.191-26.34%2011.08c-1.033.786-1.938%201.69-2.838%202.607C173.904%206.078%20152.134.07%20128.115%200C103.177.068%2081.12%205.888%2063.324%2016.159C57.661%207.848%2047.783%202.781%2034.398%202.781C13.989%202.781%200%2019.385%200%2039.788C0%2055.435%207.682%2067.87%2019.476%2073.492c-1.815%207.387-2.865%2015.139-2.865%2023.29c0%2059.075%2048.976%20105.969%20111.498%20105.969h.059c60.436%200%20111.498-48.816%20111.498-105.916c0-8.333-1.227-16.312-3.322-23.939C247.966%2066.997%20256%2054.859%20256%2039.788%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M226.806%2097.41c0%2049.378-45.422%2091.504-98.875%2091.504s-98.883-40.032-98.883-89.411c0-49.385%2045.429-89.411%2098.883-89.411s98.875%2037.933%2098.875%2087.318%22%2F%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M107.819%2078.44c-2.266%2017.232-13.732%2029.934-25.594%2028.368c-11.863-1.565-19.643-16.803-17.371-34.035s13.731-29.933%2025.6-28.368c11.863%201.559%2019.643%2016.796%2017.365%2034.035%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M98.38%2062.067c0%205.138-4.167%209.306-9.306%209.306s-9.306-4.168-9.306-9.306c0-5.139%204.167-9.307%209.306-9.307s9.306%204.168%209.306%209.307%22%2F%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M147.911%2078.44c2.272%2017.232%2013.731%2029.934%2025.594%2028.368c11.869-1.565%2019.643-16.803%2017.371-34.035s-13.732-29.933-25.595-28.368c-11.868%201.559-19.642%2016.796-17.37%2034.035%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M157.356%2062.067a9.304%209.304%200%200%200%209.306%209.306c5.139%200%209.3-4.168%209.3-9.306c0-5.139-4.161-9.307-9.3-9.307a9.304%209.304%200%200%200-9.306%209.307%22%2F%3E%3Cpath%20fill%3D%22%23090b08%22%20d%3D%22M134.853%20138.443v-10.208c0-.554-.053-1.078-.167-1.556c7.579-1.457%2013.079-5.528%2013.079-10.379c0-4.756-1.057-8.805-8.401-10.344c-2.035-.422-8.415-.654-10.7-.654c-2.186%200-8.474.212-10.429.601c-7.491%201.487-8.679%205.582-8.679%2010.397c0%206.007%208.385%2010.871%2018.788%2010.972c-.04.316-.096.621-.096.963v10.683c-15.285-.189-29.511-10.613-29.511-3.649c0%207.034%2015.138%2013.699%2030.581%2013.699s27.959-5.7%2027.959-12.735c0-6.069-9.814.337-22.424%202.21%22%2F%3E%3Cpath%20fill%3D%22%23e7ebe0%22%20d%3D%22M136.946%20114.206c0%201.962-4.861%203.56-8.282%203.56s-8.289-1.598-8.289-3.56c0-1.565%202.476-2.893%204.907-3.375c.634-.126%202.675-.192%203.382-.192c.74%200%202.807.08%203.467.212c2.378.495%204.815%201.809%204.815%203.355%22%2F%3E%3Cpath%20fill%3D%22%23e1dedc%22%20d%3D%22M127.931%2010.092c-53.454%200-98.883%2040.026-98.883%2089.411c0%2049.379%2045.429%2089.411%2098.883%2089.411c-2.134%200-4.254-.086-6.354-.211q4.179-.26%208.269-.846c-46.756-6.578-84.047-43.619-84.047-88.354c0-44.86%2037.496-81.98%2084.437-88.4a113%20113%200%200%200-8.514-.812c2.061-.119%204.128-.199%206.209-.199%22%2F%3E%3Cpath%20fill%3D%22%23f1efee%22%20d%3D%22M127.931%2010.092c2.86%200%205.693.133%208.507.344c-2.081.165-4.155.383-6.202.667c46.743%206.262%2084.008%2041.578%2084.008%2086.307c0%2044.847-37.476%2083.691-84.398%2090.447q3.142.436%206.334.694c-2.728.224-5.475.363-8.249.363c53.453%200%2098.875-42.126%2098.875-91.504c0-49.385-45.422-87.318-98.875-87.318%22%2F%3E%3Cpath%20fill%3D%22%23d3d0cd%22%20d%3D%22M129.846%20187.857q-4.09.587-8.269.846c2.1.125%204.22.211%206.354.211c2.774%200%205.521-.139%208.249-.363q-3.192-.258-6.334-.694m-1.915-177.765c-2.081%200-4.148.08-6.209.199q4.302.248%208.514.812c2.047-.284%204.121-.502%206.202-.667a114%20114%200%200%200-8.507-.344%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M229.008%2054.533c4.09-3.612%206.722-8.837%206.722-14.725c0-10.885-8.824-19.716-19.716-19.716c-4.74%200-9.031%201.742-12.431%204.529c10.633%208.313%2019.267%2018.423%2025.425%2029.912m-202.959.827c5.817-11.823%2014.191-22.108%2024.688-30.52c-3.439-2.919-7.835-4.748-12.699-4.748c-10.885%200-19.716%208.831-19.716%2019.716c0%206.356%203.059%2011.947%207.727%2015.552%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

给 panda 加一点动效

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

panda 呼吸动效演示

呼吸

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

css呼吸动效样式
.icon-panda {
  animation: icon-breathe 1.8s ease-in-out infinite;
}

@keyframes icon-breathe {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}
panda 旋转动效演示

旋转

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

css旋转动效样式
.icon-panda {
  animation: icon-spin 1.6s linear infinite;
}

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

SVG 健康报告

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

文件体积

3.28 KB

3,361 字节

viewBox

0 0 256 203

矢量坐标系

图元总数

12

<path> ×12

风格

多色填充

填充跟随容器颜色

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

常见问题

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

panda 图标是什么？▾

它是 SVG Logos（logos）开源图标集中的 panda 图标，多色填充，viewBox 为 0 0 256 203，文件仅 3.28 KB，矢量格式可无损缩放到任意尺寸。

如何下载 panda 图标？▾

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

panda 图标可以商用吗？▾

该图标采用 CC0（CC0-1.0） 开源协议，通常允许在遵守协议的前提下免费使用，常见要求是保留作者版权声明。商用前建议阅读协议原文确认。

如何修改 panda 图标的颜色？▾

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

SVG Logos 中的相近图标

pandas
pandacss
bigpanda
pandas-icon
pandacss-icon