SVG 图标

Trex Medical

还没有评分，抢首评

医疗健康

复制与下载

SVG 矢量格式 · 当前版本

使用场景

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

按钮内

输入框

搜索Trex Medical...

导航

Trex Medical

空状态

暂无内容

场景预览

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

手机桌面 · App 图标

9:41

Trex Medical

浏览器 · 标签页与站点

6bbe5b6994deeb9b.example

Trex Medical开始使用

操作按钮 · 主次层级

Trex Medical了解更多

底部导航 · Tab 栏

Trex Medical推荐收藏我的

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

React 组件

内联引入

react

import { TrexMedicalIcon } from './icons';

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

输入框前缀

搜索框

搜索Trex Medical…

html

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

动效图标

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

描画

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

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

呼吸

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

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

旋转

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

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

用法示例

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

继续下一步

按钮内
16px · action 触发

Trex Medical

导航项
18px · 列表选中态

暂无数据

空状态
40px · 引导提示

各尺寸下的 Trex Medical

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

24px

32px

48px

64px

96px

128px

下载 Trex Medical 图标

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

按预览颜色导出自定义尺寸px（16~1024）

复制 Trex Medical 图标代码

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 fill="#4b8eb7" d="M2.834 70.347h52.425v23.259H2.834V70.347z"/><path fill="#4b8eb7" d="M34.892 114.455h20.367V93.606H34.892v20.849z"/><path fill="#4b8eb7" d="M34.892 122.41h-23.38V93.606h23.38v28.804z"/><path fill="#4b8eb7" d="M149.6 71.129l10.199 12.277-13.022 13.166h12.938l6.639-7.428 10.417 11.12h10.889l-14.82-17.498 11.017-11.637H170.91l-4.281 6.085-4.58-6.085H149.6z"/><path fill="#4b8eb7" d="M124.627 71.129v25.443h30.408v-5.5h-21.23v-4.736h17.386v-5.489h-17.386v-5.008h12.877v-4.71h-22.055z"/><path d="M105.244 76.693h2.879c.805 0 2.047.083 2.9.742.396.305.805.853.805 1.706 0 .63-.219 1.232-.893 1.743-.842.638-1.875.705-2.768.705h-2.924v-4.896h.001zm-8.788-5.564v25.443h8.789v-9.495h1.092l11.844 13.186h10.441L115.545 86.02c3.748.053 7.207-3.035 7.014-7.25-.285-6.176-5.799-7.641-10.857-7.641H96.456zM68.522 71.129v4.71h7.561v20.733h9.371V75.839h8.533v-4.71H68.522z" fill="#4b8eb7"/><path d="M80.17 116.486h-1.388l-1.171-6.972-3.334 7.205-3.339-7.209-1.17 6.976h-1.387l1.989-10.994 3.909 8.26 3.906-8.252 1.985 10.986zM87.08 114.934a3.318 3.318 0 0 1-1.26 1.285c-.557.332-1.149.5-1.777.5-1.013 0-1.831-.322-2.452-.961-.623-.643-.935-1.482-.935-2.523 0-.967.292-1.779.878-2.439.613-.686 1.405-1.031 2.375-1.031.99 0 1.772.336 2.348 1.004.549.635.823 1.453.823 2.451v.217h-5.135c0 .645.19 1.17.571 1.574.38.404.873.607 1.477.607.911 0 1.601-.414 2.069-1.242l1.018.558zm-1.24-2.44c-.081-.492-.287-.891-.625-1.191-.335-.303-.757-.453-1.263-.453-.487 0-.918.15-1.289.451a2.028 2.028 0 0 0-.719 1.193h3.896zM94.434 116.486h-1.26v-1.1c-.604.887-1.382 1.332-2.336 1.332-.858 0-1.584-.334-2.174-.998-.59-.662-.885-1.475-.885-2.43 0-1.023.293-1.867.875-2.531.583-.662 1.32-.996 2.212-.996.916 0 1.684.451 2.307 1.357v-5.906h1.26v11.272h.001zm-1.199-3.183v-.123c0-.662-.2-1.209-.602-1.646a1.953 1.953 0 0 0-1.496-.654c-.604 0-1.106.221-1.506.666-.399.443-.599 1.002-.599 1.674 0 .697.197 1.268.592 1.715.395.445.904.668 1.527.668.619 0 1.121-.213 1.505-.639.386-.429.579-.984.579-1.661zM97.525 106.971c0 .227-.088.43-.264.607-.176.176-.378.264-.607.264s-.43-.088-.606-.264a.842.842 0 0 1-.264-.607.82.82 0 0 1 .264-.602c.176-.17.378-.256.606-.256s.431.086.607.256a.816.816 0 0 1 .264.602zm-.242 9.515H96.03v-6.52h1.253v6.52zM103.805 116.285c-.533.287-1.146.434-1.838.434-.98 0-1.805
…

预览参数

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

颜色

风格变体

细线 · 1.2px · 密集布局

常规 · 2px · 通用界面

加粗 · 3.5px · 大尺寸标题

关于 Trex Medical 图标

Trex Medical 是医疗健康分类下的矢量图标（SVG 格式），矢量特性意味着任意缩放不失真，适配网页、App、演示文稿与印刷物料。医疗机构与健康管理平台的品牌标识。

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

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

常见问题

Trex Medical 图标是什么？

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

如何下载 Trex Medical 图标？

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

Trex Medical 图标可以商用吗？

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

如何修改 Trex Medical 图标的颜色？

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

SVG 健康报告

100/100

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

文件体积

6.90 KB

7,066 字节

viewBox

0 0 192.756 192.756

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

图元总数

<path> ×8

风格

多彩

3 种品牌色 · 纯填充

提取色值#4b8eb7#c56da0#becddd

相似图标

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

同色系图标

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

#edf4f8#d3e4ee#a8c8dc#75a8c8#4687af#4b8eb7#356785#24455a

Trex Medical 品牌色详表
RGB	HSL	CMYK	色名
75, 142, 183	203°, 43%, 51%	59, 22, 0, 28	品牌主色 · 宝蓝色
211, 228, 238	202°, 44%, 88%	11, 4, 0, 7	浅灰色
168, 200, 220	203°, 43%, 76%	24, 9, 0, 14	天蓝色
117, 168, 200	203°, 43%, 62%	42, 16, 0, 22	矢车菊蓝

#007ac2

#004775

#1879bf

#295ca7

Tourism Makes North Carolina

#234b8d

#008191

#2c487f

图标信息摘要

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