表演艺术
OpenMoji
performing-arts
正在读取图标颜色…
颜色与描边跟随预览参数实时变化,以下为常见界面中的渲染效果。
按钮内
输入框
导航
空状态
暂无内容
桌面 / 浏览器 / 按钮 / 导航栏
手机桌面 · 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">
<!-- 内联 表演艺术 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">
<!-- 内联 表演艺术 SVG -->
立即开始
</button>React 组件
内联引入
import { IconIcon } from './icons';
function Nav() {
return <IconIcon 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">
<!-- 内联 表演艺术 SVG -->
已完成
</span>输入框前缀
搜索框
<div class="flex items-center gap-2 rounded-lg border border-neutral-200 px-3 py-2 text-sm">
<!-- 内联 表演艺术 SVG -->
<input placeholder="搜索表演艺术…" 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">
<!-- 内联 表演艺术 SVG -->
</span>
<p class="mt-3 text-sm font-medium">功能名称</p>
<p class="mt-1 text-xs text-neutral-500">功能的一句话说明。</p>
</div>为 表演艺术 添加 CSS 动效,导出的 SVG 内嵌样式,单文件即可播放,无需任何依赖。
描画
线条从无到有依次绘出,适合线性图标
.icon-c4e66f0d8a704c09 { stroke-dasharray: 1; animation: svg-draw 1.2s forwards; }呼吸
透明度往复渐变,适合状态提示图标
.icon-c4e66f0d8a704c09 { animation: svg-breathe 1.8s infinite; }旋转
匀速循环旋转,适合加载中场景
.icon-c4e66f0d8a704c09 { animation: svg-spin 1.6s linear infinite; }表演艺术 在真实界面中的三种常见用法。
按钮内
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 viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M13.73 85.58L6.69 71.45c.06-9.16 1.43-16.54 1.43-16.54l6.26-.32l3.08 8.48s-.36 8.82.85 19.41c.05.47.13 1.09.2 1.57l-4.77 1.52Zm98.6-54.1l-5.39 3.15c2.05 13.03-2.83 17.71-2.83 17.71l10.32 1.23s2.51-4.6 2.48-13l-4.58-9.1Z" fill="#f44337"></path><path d="M18.49 83.93c1.45 9.95 6.19 22.11 5.33 22.63c-.53.32-6.26-4.88-6.89-4.67s-1.38 8.17-2.33 8.17C12.9 110.06 8.77 95 7.18 81c-.37-3.24-.49-6.5-.47-9.55c0 0 2.87 3.92 5.91 7.02s5.88 5.46 5.88 5.46Z" fill="#f44337"></path><path d="M123.54 60.91c.56 3.97.29 8.59-.02 12.04c-.84 9.25-5.08 22.13-10.73 30.3c-5.48 7.92-17.64 14.57-26.77 13.13c-1.26-.2-2.49-.46-3.9-1.12l1.74-22.36l-19.87 1.86c-2.33-7.84-.36-16.02 2.68-30.71c3.37-16.22 8.4-18.66 12.86-18.99c2.09-.15 4.03.22 5.96.86l17.23 17.65l20.81-2.66Z" fill="#f44337"></path><path d="M85.5 45.92c4.08 1.34 8.1 3.83 13.26 4.91c12.02 2.52 16.22-1.56 21.63 2.88c1.78 1.47 2.97 4.11 3.15 7.19c.34 5.91-5.79 26.34-15.04 36.68s-26.38 17.67-26.38 17.67c-6.64-3.13-14.27-10.89-17.25-18.03c-.34-.82-.63-1.64-.88-2.46c0 0 11.94-6.19 17.58-22.41s3.92-26.43 3.92-26.43Z" fill="#f44337"></path><path d="m31.34 80.37l3.87 8s7.6 2.8 12.61 2.12c5.51-.74 19.58-11.29 22.33-26.03c2.76-14.74-3.44-36.97-3.44-36.97L31.33 80.37Z" fill="#f44337"></path><path d="M32.72 19.18c9.77-2.16 14-9.12 22.38-8.17c7.53.86 10.07 9.97 12.41 19.51c2.33 9.54 2.4 29.69-7.42 43.02c-9.95 13.49-24.87 14.82-24.87 14.82S25.2 85.77 16.61 73.15S5.22 43.42 4.62 39.54c-.64-4.14-1.9-11.17 2.12-16.12c5.51-6.79 16.86-2.23 25.98-4.24" fill="#f44337"></path><path d="M40.34 51.38c-1.82.45-5.21 3.72-5.37 5.75c-.07.84 1.24 1.68 7.08.27s6.83-2.33 5.61-3.6c-.94-.97-4.91-3.02-7.33-2.42Zm-24.27-1.37c-1.53-.68-1.43-10.33 6.32-11.92s11.81 6.1 10.66 7.36c-1 1.09-4.29-1.59-9.5-.27c-4.08 1.03-6.48 5.27-7.47 4.83Zm34.79-18.68c-7.54 1.12-8.79 10.33-6.7 11.26c1.62.72 2.97-3.68 8.63-4.29s6.98 2.22 8.24 1.26c1.59-1.21-1.65-9.5-10.16-8.24Z" fill="#f44337"></path><path d="M43.2 63.43c12.14-2.39 14.21-13.05 17-12.52s2.75 20.13-15.21 23.26c-16.67 2.9-24.93-12.53-22.66-14.02c2.39-1.57 8.18 5.78 20.87 3.28" fill="#f44337"></path><path d="M80.56 74.97c.87-.09 1.77-.26 2.69-.54c8.06-2.41 8.06-12.12 6.27-12.46s-2.55 2.12-6.03 4.21l-4.21 4.95l1.29 3.84Z" fill="#f44337"></path><path d="M80.56 74.97c-6.33.64-11.1-3.22-10.26-5.2c.77-1.82 4.44-.11 10
…调整颜色、描边或开启轮廓化,使用场景与用法示例实时跟随。
风格变体
细线 · 1.2px · 密集布局
常规 · 2px · 通用界面
加粗 · 3.5px · 大尺寸标题
表演艺术 是通用分类下的矢量图标(SVG 格式),矢量特性意味着任意缩放不失真,适配网页、App、演示文稿与印刷物料。该品牌在所属行业的官方标识。
在本页点击「下载」即可保存 表演艺术 的 SVG 矢量文件,或在下载面板中选择 PNG(16~512px)与 Favicon 包等导出方式;也可以直接复制 SVG 源码、Data URI 或 React/Vue 组件代码。
表演艺术 的品牌标志与名称版权归其品牌方所有,本站内容仅供学习与设计识别参考,请勿用于商标注册或误导性用途;商用前请确认品牌官方的使用规范与授权要求。文件体积 3.06 KB,viewBox 为 0 0 128 128,共 12 个矢量图元。
表演艺术 是通用分类下的矢量图标(SVG 格式),矢量特性意味着任意缩放不失真,适配网页、App、演示文稿与印刷物料。
在本页点击「下载 SVG」即可保存 表演艺术 的矢量文件,或在下载面板中选择 PNG(16~512px)与 Favicon 包等导出方式;也可以直接复制 SVG 源码、Data URI 或 React/Vue 组件代码。
表演艺术 为品牌标志,版权归品牌方所有,本站内容仅供识别参考;商用前请先确认对应品牌的使用规范与授权要求。
在「预览参数」面板中调整颜色与描边宽度,使用场景与用法示例会实时跟随,确认效果后再复制或下载即可。
同时含 width/height 与 viewBox,可仅保留 viewBox 以自适应容器
文件体积
3.06 KB
3,131 字节
viewBox
0 0 128 128
同时含 width/height 与 viewBox,可仅保留 viewBox 以自适应容器
图元总数
12
<path> ×12
风格
多彩
6 种品牌色 · 纯填充
品牌色 #f44337 的同色相色阶,点击复制色值;下方为同分类中可搭配使用的图标。
| 色值 | RGB | HSL | CMYK | 色名 |
|---|---|---|---|---|
| 244, 67, 55 | 4°, 90%, 59% | 0, 73, 77, 4 | 品牌主色 · 棕色 | |
| 252, 200, 197 | 3°, 90%, 88% | 0, 21, 22, 1 | 粉红色 | |
| 249, 146, 139 | 4°, 90%, 76% | 0, 41, 44, 2 | 热粉色 | |
| 245, 82, 71 | 4°, 90%, 62% | 0, 67, 71, 4 | 棕色 |
表演艺术 是一个通用类别的单文件 SVG 矢量图标,文件体积 3.06 KB,协议为™ 品牌商标(版权归品牌方,仅供识别参考)。可在本站免费下载 表演艺术的 SVG 源文件与 PNG 位图(16-512px),支持自定义颜色与描边宽度、一键生成 Favicon 包,并提供 React / Vue 组件代码与 Data URI 引用。
同名不同风格的版本,点击查看与下载
Search for a command to run...