Incisors
incisors
hazmat-suit
正在读取图标颜色…
颜色与描边跟随预览参数实时变化,以下为常见界面中的渲染效果。
按钮内
输入框
导航
空状态
暂无内容
桌面 / 浏览器 / 按钮 / 导航栏
手机桌面 · App 图标
浏览器 · 标签页与站点
操作按钮 · 主次层级
底部导航 · Tab 栏
真实组件上下文中的渲染效果,代码可直接复制。
导航项
导航菜单
<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">
<!-- 内联 Hazmat Suit SVG -->
<span>导航菜单</span>
</a>主要按钮
立即开始
<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">
<!-- 内联 Hazmat Suit SVG -->
立即开始
</button>React 组件
内联引入
import { HazmatSuitIcon } from './icons';
function Nav() {
return <HazmatSuitIcon className="size-4" />;
}状态徽标
已完成
<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">
<!-- 内联 Hazmat Suit SVG -->
已完成
</span>输入框前缀
搜索框
<div class="flex items-center gap-2 rounded-lg border border-neutral-200 px-3 py-2 text-sm">
<!-- 内联 Hazmat Suit SVG -->
<input placeholder="搜索Hazmat Suit…" class="w-full outline-none" />
</div>功能卡片
功能名称
功能名称
功能的一句话说明。
<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">
<!-- 内联 Hazmat Suit SVG -->
</span>
<p class="mt-3 text-sm font-medium">功能名称</p>
<p class="mt-1 text-xs text-neutral-500">功能的一句话说明。</p>
</div>为 Hazmat Suit 添加 CSS 动效,导出的 SVG 内嵌样式,单文件即可播放,无需任何依赖。
描画
线条从无到有依次绘出,适合线性图标
.icon-c5e3edc003c0df4e { stroke-dasharray: 1; animation: svg-draw 1.2s forwards; }呼吸
透明度往复渐变,适合状态提示图标
.icon-c5e3edc003c0df4e { animation: svg-breathe 1.8s infinite; }旋转
匀速循环旋转,适合加载中场景
.icon-c5e3edc003c0df4e { animation: svg-spin 1.6s linear infinite; }Hazmat Suit 在真实界面中的三种常见用法。
按钮内
16px · action 触发
导航项
18px · 列表选中态
暂无数据
空状态
40px · 引导提示
24px 到 128px 六个常用尺寸的真实渲染,用于检查小尺寸下的可读性。
24px
32px
48px
64px
96px
128px
SVG 矢量文件、PNG 位图(预设 16~512px 或自定义 16~1024px)、Favicon 包、App 图标包(iOS + Android)与矢量 PDF 一键导出;下载前可在下方「预览参数」改色,导出文件同步生效。
Web、移动端、桌面端与小程序共 17 种格式;代码基于当前预览颜色生成,复制即用。
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 45c-35.333 0-70.707 3.979-98.607 11.676c-26.393 7.28-45.193 18.363-52.12 29.449l31.352 297.842c.901.593 3.648 2.66 9.256 4.601c6.885 2.383 16.619 4.618 28.043 6.45c22.848 3.662 52.539 5.814 82.17 6.12c29.63.307 59.297-1.236 82.039-4.732c11.37-1.747 21.026-4.017 27.777-6.54c5.909-2.21 8.64-4.599 9.408-5.374l31.409-298.367C399.8 75.039 381 63.956 354.607 56.675C326.707 48.98 291.333 45 256 45m-.01 59.137c37.028-.094 74.071 6.24 114.76 19.293l6.855 2.199l-20.869 233.723c-4.116 6.372-11.53 9.046-17.246 10.585c-6.246 1.69-13.85 2.969-22.557 4C299.52 376.001 277.78 377 256 377s-43.52-.999-60.934-3.063c-8.707-1.031-16.31-2.31-22.556-4c-9.482-3.465-12.11-3.738-17.246-10.585L135.035 132.8l-.644-7.235l6.931-2.158c40.627-12.657 77.64-19.178 114.668-19.271zM256 132c-28.005.057-54.002 20.112-68.746 53.033c5.885-.227 12.083-.352 18.184-.16c7.3.23 14.433.904 20.63 2.367c8.487 2.004 14.262 7.006 19.086 10.494S253.373 203 256 203s6.022-1.778 10.846-5.266s10.599-8.49 19.086-10.494c11.391-2.689 25.927-2.706 38.869-2.205C310.047 152.09 284.025 132.031 256 132m163.918.762l-2.17 20.607c7.773 6.04 14.416 13.272 17.897 21.973c5.96 14.901 4.597 36.162-19.118 69.097a84 84 0 0 1 5.11 2.924c3.523 2.196 6.772 4.686 9.568 7.45c25.766-36.133 29.768-64.61 21.15-86.155c-6.63-16.577-19.586-27.807-32.437-35.896m-225.123 70.111c-3.457.032-6.9.13-10.17.28c-5.127.234-9.238.567-13.102.876l14.625 53.547c4.92-4.038 10.766-6.576 17.352-6.576c9.26 0 17.052 5.018 22.863 12.176c2.636-5.164 5.46-9.81 8.405-13.783C240.464 241.703 246 235 256 235s15.537 6.703 21.232 14.393c2.944 3.974 5.77 8.62 8.405 13.783C291.447 256.018 299.24 251 308.5 251c8.432 0 15.648 4.163 21.26 10.31l11.445-57.232c-3.974-.324-8.418-.678-13.83-.926c-13.078-.597-28.938-.368-37.307 1.608c-3.12.736-7.383 3.733-12.675 7.56S265.299 221 256 221s-16.1-4.853-21.393-8.68s-9.555-6.824-12.675-7.56c-4.185-.988-10.241-1.54-16.887-1.77a237 237 0 0 0-10.25-.117M256 253.592c-.988.786-3.837 2.56-6.768 6.515c-4.175 5.638-8.738 14.157-12.427 24.065C238.89 291.468 240 299.517 240 308c0 14.648-3.288 28.016-9.246 38.416c-.581 1.014-1.205 2-1.852 2.967c9.34 5.148 17.63 9.499 27.098 9.617c11.958-.485 18.348-4.945 27.088-9.633a51 51 0 0 1-1.842-2.951C275.288 336.016 272 322.648 272 308c0-8.483 1.11-16.532 3.195-23.828c-3.689-9.908-8.252-18.427-12.427-24.065c-2.
…调整颜色、描边或开启轮廓化,使用场景与用法示例实时跟随。
风格变体
细线 · 1.2px · 密集布局
常规 · 2px · 通用界面
加粗 · 3.5px · 大尺寸标题
Hazmat Suit 是通用分类下的矢量图标(SVG 格式),矢量特性意味着任意缩放不失真,适配网页、App、演示文稿与印刷物料。该品牌在所属行业的官方标识。
在本页点击「下载」即可保存 Hazmat Suit 的 SVG 矢量文件,或在下载面板中选择 PNG(16~512px)与 Favicon 包等导出方式;也可以直接复制 SVG 源码、Data URI 或 React/Vue 组件代码。
Hazmat Suit 的品牌标志与名称版权归其品牌方所有,本站内容仅供学习与设计识别参考,请勿用于商标注册或误导性用途;商用前请确认品牌官方的使用规范与授权要求。文件体积 3.69 KB,viewBox 为 0 0 512 512,共 1 个矢量图元。
Hazmat Suit 是通用分类下的矢量图标(SVG 格式),矢量特性意味着任意缩放不失真,适配网页、App、演示文稿与印刷物料。
在本页点击「下载 SVG」即可保存 Hazmat Suit 的矢量文件,或在下载面板中选择 PNG(16~512px)与 Favicon 包等导出方式;也可以直接复制 SVG 源码、Data URI 或 React/Vue 组件代码。
Hazmat Suit 为品牌标志,版权归品牌方所有,本站内容仅供识别参考;商用前请先确认对应品牌的使用规范与授权要求。
在「预览参数」面板中调整颜色与描边宽度,使用场景与用法示例会实时跟随,确认效果后再复制或下载即可。
同时含 width/height 与 viewBox,可仅保留 viewBox 以自适应容器
文件体积
3.69 KB
3,779 字节
viewBox
0 0 512 512
同时含 width/height 与 viewBox,可仅保留 viewBox 以自适应容器
图元总数
1
<path> ×1
风格
单色轮廓
无显式填色,跟随容器 currentColor
Hazmat Suit 是一个通用类别的单文件 SVG 矢量图标,文件体积 3.69 KB,协议为™ 品牌商标(版权归品牌方,仅供识别参考)。可在本站免费下载 Hazmat Suit的 SVG 源文件与 PNG 位图(16-512px),支持自定义颜色与描边宽度、一键生成 Favicon 包,并提供 React / Vue 组件代码与 Data URI 引用。
Search for a command to run...