跳到主要内容
网站首页

图标库

返回 SVG 图标
Quintus

SVG 图标

Quintus

还没有评分，抢首评

复制与下载

SVG 矢量格式 · 当前版本

使用场景

颜色与描边跟随预览参数实时变化，以下为常见界面中的渲染效果。

按钮内

输入框

搜索Quintus...

导航

Quintus

空状态

暂无内容

场景预览

桌面 / 浏览器 / 按钮 / 导航栏

手机桌面 · App 图标

9:41
Quintus

浏览器 · 标签页与站点

0cd0c5a7d1a4e08b.example
Quintus开始使用

操作按钮 · 主次层级

Quintus了解更多

底部导航 · Tab 栏

Quintus推荐收藏我的

UI 使用示例

真实组件上下文中的渲染效果，代码可直接复制。

导航项

导航菜单

导航菜单
html
<a href="#" class="flex items-center gap-2.5 rounded-lg px-3 py-2 text-sm text-neutral-700 hover:bg-neutral-100 dark:text-neutral-200 dark:hover:bg-neutral-800">
  <!-- 内联 Quintus SVG -->
  <span>导航菜单</span>
</a>

主要按钮

立即开始

html
<button class="inline-flex items-center gap-2 rounded-lg bg-neutral-900 px-4 py-2 text-sm font-medium text-white dark:bg-neutral-100 dark:text-neutral-900">
  <!-- 内联 Quintus SVG -->
  立即开始
</button>

React 组件

内联引入

react
import { QuintusIcon } from './icons';

function Nav() {
  return <QuintusIcon className="size-4" />;
}

状态徽标

已完成

已完成
html
<span class="inline-flex items-center gap-1.5 rounded-full bg-neutral-100 px-2.5 py-1 text-xs font-medium text-neutral-700">
  <!-- 内联 Quintus SVG -->
  已完成
</span>

输入框前缀

搜索框

搜索Quintus…
html
<div class="flex items-center gap-2 rounded-lg border border-neutral-200 px-3 py-2 text-sm">
  <!-- 内联 Quintus SVG -->
  <input placeholder="搜索Quintus…" class="w-full outline-none" />
</div>

功能卡片

功能名称

功能名称

功能的一句话说明。

html
<div class="rounded-xl border border-neutral-200 p-4">
  <span class="flex size-9 items-center justify-center rounded-lg bg-neutral-900 text-white">
    <!-- 内联 Quintus SVG -->
  </span>
  <p class="mt-3 text-sm font-medium">功能名称</p>
  <p class="mt-1 text-xs text-neutral-500">功能的一句话说明。</p>
</div>

动效图标

为 Quintus 添加 CSS 动效，导出的 SVG 内嵌样式，单文件即可播放，无需任何依赖。

描画

线条从无到有依次绘出，适合线性图标

.icon-0cd0c5a7d1a4e08b { stroke-dasharray: 1; animation: svg-draw 1.2s forwards; }

呼吸

透明度往复渐变，适合状态提示图标

.icon-0cd0c5a7d1a4e08b { animation: svg-breathe 1.8s infinite; }

旋转

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

.icon-0cd0c5a7d1a4e08b { animation: svg-spin 1.6s linear infinite; }

用法示例

Quintus 在真实界面中的三种常见用法。

继续下一步

按钮内
16px · action 触发

Quintus

导航项
18px · 列表选中态

暂无数据

空状态
40px · 引导提示

各尺寸下的 Quintus

24px 到 128px 六个常用尺寸的真实渲染，用于检查小尺寸下的可读性。

24px

32px

48px

64px

96px

128px

下载 Quintus 图标

SVG 矢量文件、PNG 位图（预设 16~512px 或自定义 16~1024px）、Favicon 包、App 图标包（iOS + Android）与矢量 PDF 一键导出；下载前可在下方「预览参数」改色，导出文件同步生效。

按预览颜色导出px（16~1024）

复制 Quintus 图标代码

Web、移动端、桌面端与小程序共 17 种格式；代码基于当前预览颜色生成，复制即用。

svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192.756 192.756"><g fill-rule="evenodd" clip-rule="evenodd"><path d="M135.506 107.578V25.321h-72.08v82.257h72.08z"/><path d="M87.706 94.611h-3.499c-8.178 0-15.044-1.581-20.794-4.444l-.021-10.603c4.906 6.488 12.073 10.75 22.171 10.647 0 0 5.37.128 10.265-1.241 14.103-6.317 17.712-20.869 17.712-32.827 0-9.083-3.17-22.317-11.277-30.887l12.607.032c7.023 7.847 10.627 18.524 10.627 30.177 0 19.517-10.492 31.476-25.156 36.888-.001.001-7.35 2.063-12.635 2.258z" fill="#ceb081"/><path d="M96.946 90.349c-6.309-3.577-9.849-5.479-13.528-5.719-2.717-.177-5.463.784-7.159 1.986l-.483-.737c4.5-5.252 8.287-8.297 14.86-7.866 6.133.399 13.841 4.993 17.396 7.165l5.547 3.167c2.361 1.554 5.771 2.739 7.875 2.875 4.029.265 7.188-1.206 8.865-4.003l.832.542c-2.566 6.935-7.082 11.799-14.533 11.312-4.381-.287-8.043-2.141-12.037-4.339l-7.635-4.383z" fill="#ceb081"/><path d="M19.638 154.088H18.33c-10.343 0-15.495-6.756-15.495-15.959 0-9.373 6.629-14.777 15.41-14.777 10.176 0 15.536 7.387 15.536 16.084 0 7.305-3.925 11.781-9.415 13.805 0-.001-2.187.747-4.728.847zm3.04-2.111c5.276-2.365 6.627-7.812 6.627-12.287 0-5.402-2.996-14.732-11.652-14.732-6.796 0-10.343 5.021-10.343 12.201 0 7.303 3.083 15.365 11.527 15.281 2.734.097 3.841-.463 3.841-.463z"/><path d="M23.283 152.689c-2.505-1.418-3.908-2.174-5.366-2.268-1.08-.074-2.169.309-2.842.787l-.191-.293c1.786-2.084 3.288-3.291 5.894-3.121 2.435.16 5.491 1.982 6.902 2.842l2.199 1.258c.938.615 2.29 1.086 3.124 1.141 1.598.105 2.852-.48 3.519-1.59l.329.215c-1.018 2.752-2.811 4.682-5.765 4.488-1.737-.113-3.191-.85-4.773-1.721l-3.03-1.738zM64.042 134.312v.816c-2.764.17-2.859.227-2.859 1.807v9.705c0 1.691-.318 3.186-.86 4.174-1.46 2.793-4.797 3.441-7.942 3.441-3.115 0-6.45-.678-7.911-3.441-.54-.959-.826-2.453-.86-4.119v-9.76c0-1.58-.062-1.637-2.859-1.807v-.816h8.864v.816c-2.764.17-2.859.227-2.859 1.807v9.139c0 2.682.478 4.373 1.431 5.502.984 1.129 2.384 1.691 4.194 1.691 1.844 0 3.241-.562 4.226-1.691.953-1.129 1.43-2.82 1.43-5.502v-9.139c0-1.58-.064-1.637-2.859-1.807v-.816h8.864zM77.983 151.211c0 1.578.096 1.635 2.861 1.805v.818h-8.866v-.818c2.797-.17 2.86-.227 2.86-1.805v-14.275c0-1.58-.063-1.637-2.86-1.807v-.816h8.866v.816c-2.765.17-2.861.227-2.861 1.807v14.275zM96.131 134.312c4.099 5.189 8.23 10.379 12.392 15.57l.064.057v-9.9c0-1.496-.064-2.568-.223-3.5-.189-1.184-.955-1.27-3.02-1.41v-.816h7.53
…

预览参数

调整颜色、描边或开启轮廓化，使用场景与用法示例实时跟随。

风格变体

细线 · 1.2px · 密集布局

常规 · 2px · 通用界面

加粗 · 3.5px · 大尺寸标题

关于 Quintus 图标

Quintus 是通用分类下的矢量图标（SVG 格式），矢量特性意味着任意缩放不失真，适配网页、App、演示文稿与印刷物料。该品牌在所属行业的官方标识。

在本页点击「下载」即可保存 Quintus 的 SVG 矢量文件，或在下载面板中选择 PNG（16~512px）与 Favicon 包等导出方式；也可以直接复制 SVG 源码、Data URI 或 React/Vue 组件代码。

Quintus 的品牌标志与名称版权归其品牌方所有，本站内容仅供学习与设计识别参考，请勿用于商标注册或误导性用途；商用前请确认品牌官方的使用规范与授权要求。文件体积 3.81 KB，viewBox 为 0 0 192.756 192.756，共 5 个矢量图元。

常见问题

Quintus 图标是什么？

Quintus 是通用分类下的矢量图标（SVG 格式），矢量特性意味着任意缩放不失真，适配网页、App、演示文稿与印刷物料。

如何下载 Quintus 图标？

在本页点击「下载 SVG」即可保存 Quintus 的矢量文件，或在下载面板中选择 PNG（16~512px）与 Favicon 包等导出方式；也可以直接复制 SVG 源码、Data URI 或 React/Vue 组件代码。

Quintus 图标可以商用吗？

Quintus 为品牌标志，版权归品牌方所有，本站内容仅供识别参考；商用前请先确认对应品牌的使用规范与授权要求。

如何修改 Quintus 图标的颜色？

在「预览参数」面板中调整颜色与描边宽度，使用场景与用法示例会实时跟随，确认效果后再复制或下载即可。

SVG 健康报告

100/100

同时含 width/height 与 viewBox，可仅保留 viewBox 以自适应容器

文件体积

3.81 KB

3,903 字节

viewBox

0 0 192.756 192.756

同时含 width/height 与 viewBox，可仅保留 viewBox 以自适应容器

图元总数

5

<path> ×5

风格

双色

2 种品牌色 · 纯填充

提取色值#ceb081#ab1447

相似图标

按名称与标签相似度排序。

81%
77%
75%
73%
70%
69%
69%
68%
67%
67%
65%
65%

同色系图标

品牌色 #ceb081 的同色相色阶，点击复制色值；下方为品牌色同色相的其他图标。

#f8f3ed#eee3d3#ddc8a7#c9a873#b08645#ceb081#ba904e#926f39
Quintus 品牌色详表
色值RGBHSLCMYK色名
206, 176, 12937°, 44%, 66%0, 15, 37, 19品牌主色 · 驼色
238, 227, 21136°, 44%, 88%0, 5, 11, 7米色
221, 200, 16737°, 44%, 76%0, 10, 24, 13银色
201, 168, 11537°, 44%, 62%0, 16, 43, 21驼色
#9f6f66

图标信息摘要

Quintus 是一个通用类别的单文件 SVG 矢量图标，文件体积 3.81 KB，协议为™ 品牌商标（版权归品牌方，仅供识别参考）。可在本站免费下载 Quintus的 SVG 源文件与 PNG 位图（16-512px），支持自定义颜色与描边宽度、一键生成 Favicon 包，并提供 React / Vue 组件代码与 Data URI 引用。

继续探索

相关搜索

QuintelQuintiles TransnationalQuintelaQuintumQuinencoQuintessenceQuiznosQuinte+Quinta De MosteiroQuillet Diffusion

相关图标

暂无相关图标

Command Palette

Search for a command to run...