跳到主要内容
网站首页

图标库

← theSVG Color
Argos

Argos

argos

图标库
theSVG Color
作者
theSVG Color Contributors

正在读取图标颜色…

使用场景

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

按钮内

输入框

搜索Argos...

导航

Argos

空状态

暂无内容

场景预览

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

手机桌面 · App 图标

9:41
Argos

浏览器 · 标签页与站点

6e44e092ca7acc9a.example
Argos开始使用

操作按钮 · 主次层级

Argos
了解更多

底部导航 · Tab 栏

Argos
推荐收藏我的

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">
  <!-- 内联 Argos 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">
  <!-- 内联 Argos SVG -->
  立即开始
</button>

React 组件

内联引入

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

function Nav() {
  return <ArgosIcon 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">
  <!-- 内联 Argos SVG -->
  已完成
</span>

输入框前缀

搜索框

搜索Argos…
html
<div class="flex items-center gap-2 rounded-lg border border-neutral-200 px-3 py-2 text-sm">
  <!-- 内联 Argos SVG -->
  <input placeholder="搜索Argos…" 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">
    <!-- 内联 Argos SVG -->
  </span>
  <p class="mt-3 text-sm font-medium">功能名称</p>
  <p class="mt-1 text-xs text-neutral-500">功能的一句话说明。</p>
</div>

动效图标

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

描画

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

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

呼吸

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

.icon-6e44e092ca7acc9a { animation: svg-breathe 1.8s infinite; }

旋转

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

.icon-6e44e092ca7acc9a { animation: svg-spin 1.6s linear infinite; }

用法示例

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

继续下一步

按钮内
16px · action 触发

Argos

导航项
18px · 列表选中态

暂无数据

空状态
40px · 引导提示

各尺寸下的 Argos

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

24px

32px

48px

64px

96px

128px

下载 Argos 图标

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

按预览颜色导出px(16~1024)

复制 Argos 图标代码

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

svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#da291c" d="M0 1.738v20.524h24V1.738zm5.93 5.546c.178 0 .434 0 .638.026c.23 0 .307.077.333.281c.051.792.23 4.217.256 4.907c0 .18-.103.23-.23.23H6.21c-.179 0-.256-.102-.256-.23c0-.255-.026-.92-.026-.92H3.987c-.204.358-.434.767-.537.946c-.076.153-.178.179-.306.179h-.818c-.18 0-.23-.128-.153-.281C3.272 10.428 4.677 8.255 5.29 7.54c.178-.23.383-.23.638-.256zM5.831 8.48a.1.1 0 0 0-.03.032c-.46.562-1.048 1.483-1.38 2.122h1.507S5.88 9.15 5.853 8.51c0 0 0-.043-.021-.032zm14.666.237c.614 0 1.125.28 1.355.664c.102.154.076.255-.077.332a3.5 3.5 0 0 1-.434.205c-.128.025-.23.025-.333-.102c-.434-.512-1.047-.333-1.073-.051c-.026.255.256.357.639.46c.588.178 1.252.485 1.048 1.277c-.205.818-.997 1.227-1.917 1.227c-.588 0-1.253-.178-1.508-.792c-.051-.128-.026-.23.077-.28q.23-.155.46-.231c.128-.026.23 0 .306.102c.18.256.384.384.716.384c.307 0 .639-.129.613-.41c-.025-.255-.408-.357-.613-.409c-.383-.102-1.176-.28-1.176-.92c0-.792.741-1.38 1.917-1.456m-3.834.076c1.227 0 1.79.818 1.534 1.994c-.23 1.176-1.15 1.993-2.377 1.993s-1.789-.817-1.533-1.993c.255-1.176 1.15-1.994 2.376-1.994m-4.421.026c.562 0 .869.332.945.46c0 .025.026.025.026 0c.025-.077.051-.128.051-.153c.026-.128.128-.23.307-.23h.51c.154 0 .282.102.231.306a96 96 0 0 1-.741 3.067q-.575 2.223-2.3 2.224c-.46 0-1.227-.128-1.56-.664c-.076-.103-.102-.205.077-.333c.154-.102.332-.153.486-.205c.153-.05.204-.05.357.052a.9.9 0 0 0 .563.179c.409 0 .946-.23 1.201-1.1c.026-.05 0-.05-.025-.025c-.18.23-.563.383-.997.383c-.537-.025-.869-.204-1.074-.536c-.23-.358-.204-.997-.025-1.56c.28-.894.971-1.865 1.968-1.865m-3.86.026h.614c.127 0 .179.101.153.204s-.051.179-.051.204c0 .026.025.026.025.026c.46-.41 1.049-.409 1.688-.409c.102 0 .153.102.076.179c-.23.23-.358.409-.511.639c-.102.153-.18.204-.358.204c-.409.026-.613.102-.767.205c-.153.102-.307.434-.383.818a48 48 0 0 1-.332 1.61a.224.224 0 0 1-.23.179h-.742c-.102 0-.178-.077-.153-.18c.128-.715.64-3.117.716-3.475c.026-.154.128-.204.256-.204zm8.205.792c-.69 0-.971.562-1.15 1.15c-.154.588-.23 1.15.46 1.15s.97-.562 1.15-1.15s.23-1.15-.46-1.15m-4.217.025c-.512-.025-.87.384-1.1 1.15c-.127.41-.153 1.023.384 1.1c.537.025.895-.358 1.099-1.1c.128-.485.256-1.124-.383-1.15M2.338 13.958a.3.3 0 0 1 .09.023c3.68 1.508 6.058 2.07 9.406 2.07s5.725-.562 9.43-2.07c.256-.102.41.153.155.306c-1.457.92-4.805 2.812-9.585 2.812s-8.153-1.892-9.56-2.8
…

预览参数

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

风格变体

细线 · 1.2px · 密集布局

常规 · 2px · 通用界面

加粗 · 3.5px · 大尺寸标题

关于 Argos 图标

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

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

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

常见问题

Argos 图标是什么?

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

如何下载 Argos 图标?

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

Argos 图标可以商用吗?

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

如何修改 Argos 图标的颜色?

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

SVG 健康报告

100/100

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

文件体积

2.41 KB

2,464 字节

viewBox

0 0 24 24

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

图元总数

1

<path> ×1

风格

单色品牌

1 种品牌色 · 纯填充

提取色值#da291c

同色系图标

品牌色 #da291c 的同色相色阶,点击复制色值;下方为同分类中可搭配使用的图标。

#fceae8#f8ccc9#f19993#e95e53#d9291c#da291c#9b1d14#64130d
Argos 品牌色详表
色值RGBHSLCMYK色名
218, 41, 284°, 77%, 48%0, 81, 87, 15品牌主色 · 棕色
248, 204, 2014°, 77%, 88%0, 18, 19, 3粉红色
241, 153, 1474°, 77%, 76%0, 37, 39, 5热粉色
233, 94, 834°, 77%, 62%0, 60, 64, 9驼色

图标信息摘要

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

继续探索

相关搜索

暂无推荐

Command Palette

Search for a command to run...