跳到主要内容
网站首页

图标库

返回 SVG 图标
Hyland

SVG 图标

Hyland

还没有评分，抢首评

复制与下载

SVG 矢量格式 · 当前版本

使用场景

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

按钮内

输入框

搜索Hyland...

导航

Hyland

空状态

暂无内容

场景预览

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

手机桌面 · App 图标

9:41
Hyland

浏览器 · 标签页与站点

6ceb8f116d0c9f4d.example
Hyland开始使用

操作按钮 · 主次层级

Hyland了解更多

底部导航 · Tab 栏

Hyland推荐收藏我的

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

React 组件

内联引入

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

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

输入框前缀

搜索框

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

动效图标

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

描画

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

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

呼吸

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

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

旋转

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

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

用法示例

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

继续下一步

按钮内
16px · action 触发

Hyland

导航项
18px · 列表选中态

暂无数据

空状态
40px · 引导提示

各尺寸下的 Hyland

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

24px

32px

48px

64px

96px

128px

下载 Hyland 图标

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

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

复制 Hyland 图标代码

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

svg
<svg viewBox="10.38 2.8 279.84 92.16" xmlns="http://www.w3.org/2000/svg"><g fill="#6abf4b"><path d="m10.38 69.13 7.28-1.29v-56.94l-7.11-.77v-4.22h22.52v4.22l-7.02.73v26.87h33.03v-26.87l-7.11-.73v-4.22h22.39v4.22l-6.93.73v56.98l7.41 1.29v3.66h-23.15v-3.66l7.41-1.25v-25.07h-33.04v25.02l7.41 1.29v3.66h-23.09z"/><path d="m78.25 87.39c.49.14 1.05.26 1.7.34.64.09 1.23.13 1.74.13 1.03 0 2.15-.19 3.36-.56s2.43-1.1 3.66-2.17c1.23-1.08 2.43-2.61 3.59-4.59s2.22-4.56 3.17-7.75h-1.85l-17.26-42.85-4.48-.78v-4.56h19.94v4.57l-6.2.86 10.12 28.9 2.89 8.79 2.5-8.79 8.74-29.03-6.72-.73v-4.57h18.6v4.57l-4.82.69c-1.92 5.57-3.61 10.47-5.06 14.69s-2.71 7.88-3.79 10.98-2 5.73-2.76 7.88-1.4 3.95-1.92 5.38c-.52 1.44-.93 2.59-1.25 3.47s-.59 1.6-.82 2.17c-1.12 2.87-2.25 5.45-3.38 7.75s-2.33 4.29-3.6 5.96c-1.26 1.68-2.62 3.06-4.07 4.13a13.266 13.266 0 0 1 -4.84 2.26c-1.15.29-2.41.43-3.79.43-.29 0-.6-.02-.95-.04-.34-.03-.68-.07-1.01-.13s-.62-.13-.88-.22-.45-.17-.56-.26z"/><path d="m119.36 69.13 7.32-.9v-58.32l-6.89-1.55v-3.75l13.48-1.81 1.72.99v64.43l7.67.9v3.66h-23.3zm23.53-10.21c.2-2.01.84-3.77 1.94-5.28 1.09-1.51 2.44-2.81 4.05-3.9s3.4-2 5.36-2.71c1.96-.72 3.94-1.29 5.92-1.72s3.89-.73 5.73-.9 3.43-.26 4.78-.26v-3.75c0-2.27-.3-4.11-.9-5.53s-1.44-2.53-2.5-3.34c-1.06-.8-2.31-1.35-3.75-1.64s-2.99-.43-4.65-.43c-.83 0-1.76.08-2.8.24-1.03.16-2.1.38-3.21.67s-2.22.63-3.34 1.03-2.18.85-3.19 1.34l-1.59-3.88c1.06-.86 2.36-1.61 3.9-2.26s3.12-1.18 4.74-1.62c1.62-.43 3.2-.75 4.74-.95s2.85-.3 3.94-.3c2.27 0 4.43.24 6.48.71s3.85 1.31 5.4 2.5 2.78 2.8 3.68 4.82c.91 2.02 1.36 4.6 1.36 7.73l-.09 29.63h5.51v2.84c-1.01.55-2.25.99-3.73 1.33s-2.97.52-4.46.52c-.52 0-1.08-.04-1.68-.11s-1.16-.25-1.66-.54-.92-.73-1.25-1.33-.5-1.44-.5-2.5v-1.21c-.66.8-1.44 1.55-2.35 2.24s-1.94 1.29-3.1 1.81-2.48.92-3.96 1.21-3.12.43-4.93.43c-2.24 0-4.27-.4-6.09-1.21-1.83-.8-3.35-1.89-4.57-3.25s-2.13-2.94-2.71-4.74c-.57-1.78-.75-3.68-.52-5.69zm8.35.17c0 1.7.23 3.13.69 4.31s1.13 2.13 2 2.86c.88.73 1.94 1.26 3.21 1.59 1.26.33 2.68.5 4.26.5.86 0 1.74-.12 2.63-.34.89-.23 1.75-.52 2.56-.86.82-.34 1.58-.74 2.28-1.18s1.27-.88 1.7-1.31c0-2.7.01-5.38.02-8.03.01-2.66.04-5.33.06-8.03-1.2 0-2.53.07-3.96.19-1.44.13-2.87.35-4.31.67s-2.83.73-4.18 1.25-2.54 1.17-3.57 1.96-1.86 1.71-2.48 2.78c-.6 1.04-.91 2.26-.91 3.64zm34.67 10.04 5.86-.86v-35.1l-6.12-3.36v-2.67l11.46-3.4 1.94.86v6.16c.97-.83 2.15-1.66 3.53-2.48s2.84-1.56 4.39-2.22 3.14-1.2 4.78-1
…

预览参数

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

风格变体

细线 · 1.2px · 密集布局

常规 · 2px · 通用界面

加粗 · 3.5px · 大尺寸标题

关于 Hyland 图标

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

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

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

常见问题

Hyland 图标是什么？

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

如何下载 Hyland 图标？

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

Hyland 图标可以商用吗？

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

如何修改 Hyland 图标的颜色？

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

SVG 健康报告

100/100

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

文件体积

4.05 KB

4,148 字节

viewBox

10.38 2.8 279.84 92.16

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

图元总数

3

<path> ×3

风格

单色品牌

1 种品牌色 · 纯填充

提取色值#6abf4b

相似图标

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

67%
65%
65%
64%
62%
62%
62%
62%
61%
61%
60%
60%

同色系图标

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

#eff8ec#daefd2#b4dfa5#89cc70#5fb540#6abf4b#4c9033#346223
Hyland 品牌色详表
色值RGBHSLCMYK色名
106, 191, 75104°, 48%, 52%45, 0, 61, 25品牌主色 · 灰色
218, 239, 210103°, 48%, 88%9, 0, 12, 6浅灰色
180, 223, 165104°, 48%, 76%19, 0, 26, 13银色
137, 204, 112104°, 47%, 62%33, 0, 45, 20薄荷绿
#7aa785

图标信息摘要

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

继续探索

相关搜索

RylandHyundai Department StoreWyland Marine ArtistHyperlastHyperkinHyperion CommunicationsHyteraHyltonHyperion SoftwareHytrel

相关图标

暂无相关图标

Command Palette

Search for a command to run...