opencritic SVG 图标
simple-iconsopencritic
来自 Simple Icons 开源图标集，矢量 SVG 可无损缩放到任意尺寸，支持在线改色、复制 React/Vue/HTML 代码。
- 图标 ID
- simple-icons:opencritic
- 中文名
- —
- 所属集合
- Simple Icons
- 集合规模
- 3,467 枚
- 基础网格
- 24px
- 色彩
- 单色（可改色）
- 开源协议
- CC0-1.0
- 作者
- Simple Icons Collaborators
下载 opencritic 图标
SVG 矢量源文件，或 PNG 按 16~512 预设与 16~1024 自定义尺寸导出，任意尺寸边缘锐利。
px
PNG 由矢量源实时渲染，任意尺寸边缘锐利无锯齿；下载与预览均免费，无需注册。
opencritic 的预览与使用场景
切换预览颜色后，下方三底色、真实界面场景与各尺寸渲染会实时跟随。
预览颜色
浅色背景
深色背景灰底融入在真实界面里长这样
继续按钮内 · 主操作搜索opencritic…输入框 · 前缀图标opencritic导航菜单 · 选中态暂无内容空状态 · 引导提示9:41opencritic手机桌面 · App 图标
opencritic手机桌面 · App 图标opencriticsimple-icons.design/icons/opencritic浏览器 · 标签页与站点图标各尺寸下的可读性
24px32px48px64px96px128px复制 opencritic 图标代码
内联 SVG、React、Vue 与 CSS mask 四种主流引用方式，代码基于当前源文件生成，复制即用。
svgSVG 源码（内联 HTML）
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.965 0a12 12 0 0 0-4.28.8a12 12 0 0 0-3.663 2.237A12 12 0 0 0 .22 14.29a11.9 11.9 0 0 0 1.93 4.565a12.04 12.04 0 0 0 5.896 4.478a12.04 12.04 0 0 0 8.793-.347a12 12 0 0 0 3.082-1.97q-1.169-1.175-2.34-2.345a8.7 8.7 0 0 1-2.69 1.533a8.73 8.73 0 0 1-4.757.29a8.66 8.66 0 0 1-3.485-1.637a8.7 8.7 0 0 1-2.394-2.9a8.72 8.72 0 0 1-.629-6.31a8.73 8.73 0 0 1 4.447-5.405a8.66 8.66 0 0 1 4.082-.934a8.67 8.67 0 0 1 5.43 2.027c.779-.78 1.562-1.56 2.34-2.344a12 12 0 0 0-3.77-2.25a12 12 0 0 0-4.19-.74zm9.047 4.076L18.67 6.418l.002.002a8.7 8.7 0 0 1 1.72 3.29a8.75 8.75 0 0 1-.046 4.742a8.7 8.7 0 0 1-1.678 3.13l2.342 2.341a12 12 0 0 0 2.347-4.04a12.05 12.05 0 0 0-.35-8.668a12 12 0 0 0-1.995-3.138zm-8.91.21a7.7 7.7 0 0 0-2.965.55v.002q-.002 1.605 0 3.21L12 10.913c.96-.954 1.912-1.91 2.87-2.867V4.838a7.7 7.7 0 0 0-2.768-.553zM8.045 9.13c-1.07.003-2.14-.003-3.209.004a7.77 7.77 0 0 0 .004 5.733l3.203.002q1.439-1.434 2.873-2.872zm7.916 0c-.962.953-1.917 1.91-2.875 2.867V12q1.436 1.435 2.875 2.87h3.203a7.75 7.75 0 0 0 0-5.74c-1.068 0-2.135.004-3.203 0M12 13.084L9.137 15.95v3.211a7.72 7.72 0 0 0 5.734-.002v-3.203c-.957-.957-1.91-1.917-2.87-2.87z"/></svg>reactReact 组件（TSX）
export function OpencriticIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width="1em"
height="1em"
viewBox="0 0 24 24"
fill="currentColor"
{...props}
dangerouslySetInnerHTML={{ __html: `<path fill="currentColor" d="M11.965 0a12 12 0 0 0-4.28.8a12 12 0 0 0-3.663 2.237A12 12 0 0 0 .22 14.29a11.9 11.9 0 0 0 1.93 4.565a12.04 12.04 0 0 0 5.896 4.478a12.04 12.04 0 0 0 8.793-.347a12 12 0 0 0 3.082-1.97q-1.169-1.175-2.34-2.345a8.7 8.7 0 0 1-2.69 1.533a8.73 8.73 0 0 1-4.757.29a8.66 8.66 0 0 1-3.485-1.637a8.7 8.7 0 0 1-2.394-2.9a8.72 8.72 0 0 1-.629-6.31a8.73 8.73 0 0 1 4.447-5.405a8.66 8.66 0 0 1 4.082-.934a8.67 8.67 0 0 1 5.43 2.027c.779-.78 1.562-1.56 2.34-2.344a12 12 0 0 0-3.77-2.25a12 12 0 0 0-4.19-.74zm9.047 4.076L18.67 6.418l.002.002a8.7 8.7 0 0 1 1.72 3.29a8.75 8.75 0 0 1-.046 4.742a8.7 8.7 0 0 1-1.678 3.13l2.342 2.341a12 12 0 0 0 2.347-4.04a12.05 12.05 0 0 0-.35-8.668a12 12 0 0 0-1.995-3.138zm-8.91.21a7.7 7.7 0 0 0-2.965.55v.002q-.002 1.605 0 3.21L12 10.913c.96-.954 1.912-1.91 2.87-2.867V4.838a7.7 7.7 0 0 0-2.768-.553zM8.045 9.13c-1.07.003-2.14-.003-3.209.004a7.77 7.77 0 0 0 .004 5.733l3.203.002q1.439-1.434 2.873-2.872zm7.916 0c-.962.953-1.917 1.91-2.875 2.867V12q1.436 1.435 2.875 2.87h3.203a7.75 7.75 0 0 0 0-5.74c-1.068 0-2.135.004-3.203 0M12 13.084L9.137 15.95v3.211a7.72 7.72 0 0 0 5.734-.002v-3.203c-.957-.957-1.91-1.917-2.87-2.87z"/>` }}
/>
);
}vueVue 3 组件
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" v-html="body"></svg>
</template>
<script setup>
const body = `<path fill="currentColor" d="M11.965 0a12 12 0 0 0-4.28.8a12 12 0 0 0-3.663 2.237A12 12 0 0 0 .22 14.29a11.9 11.9 0 0 0 1.93 4.565a12.04 12.04 0 0 0 5.896 4.478a12.04 12.04 0 0 0 8.793-.347a12 12 0 0 0 3.082-1.97q-1.169-1.175-2.34-2.345a8.7 8.7 0 0 1-2.69 1.533a8.73 8.73 0 0 1-4.757.29a8.66 8.66 0 0 1-3.485-1.637a8.7 8.7 0 0 1-2.394-2.9a8.72 8.72 0 0 1-.629-6.31a8.73 8.73 0 0 1 4.447-5.405a8.66 8.66 0 0 1 4.082-.934a8.67 8.67 0 0 1 5.43 2.027c.779-.78 1.562-1.56 2.34-2.344a12 12 0 0 0-3.77-2.25a12 12 0 0 0-4.19-.74zm9.047 4.076L18.67 6.418l.002.002a8.7 8.7 0 0 1 1.72 3.29a8.75 8.75 0 0 1-.046 4.742a8.7 8.7 0 0 1-1.678 3.13l2.342 2.341a12 12 0 0 0 2.347-4.04a12.05 12.05 0 0 0-.35-8.668a12 12 0 0 0-1.995-3.138zm-8.91.21a7.7 7.7 0 0 0-2.965.55v.002q-.002 1.605 0 3.21L12 10.913c.96-.954 1.912-1.91 2.87-2.867V4.838a7.7 7.7 0 0 0-2.768-.553zM8.045 9.13c-1.07.003-2.14-.003-3.209.004a7.77 7.77 0 0 0 .004 5.733l3.203.002q1.439-1.434 2.873-2.872zm7.916 0c-.962.953-1.917 1.91-2.875 2.867V12q1.436 1.435 2.875 2.87h3.203a7.75 7.75 0 0 0 0-5.74c-1.068 0-2.135.004-3.203 0M12 13.084L9.137 15.95v3.211a7.72 7.72 0 0 0 5.734-.002v-3.203c-.957-.957-1.91-1.917-2.87-2.87z"/>`;
</script>cssCSS mask（随 currentColor 改色）
.opencritic {
width: 1em;
height: 1em;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M11.965%200a12%2012%200%200%200-4.28.8a12%2012%200%200%200-3.663%202.237A12%2012%200%200%200%20.22%2014.29a11.9%2011.9%200%200%200%201.93%204.565a12.04%2012.04%200%200%200%205.896%204.478a12.04%2012.04%200%200%200%208.793-.347a12%2012%200%200%200%203.082-1.97q-1.169-1.175-2.34-2.345a8.7%208.7%200%200%201-2.69%201.533a8.73%208.73%200%200%201-4.757.29a8.66%208.66%200%200%201-3.485-1.637a8.7%208.7%200%200%201-2.394-2.9a8.72%208.72%200%200%201-.629-6.31a8.73%208.73%200%200%201%204.447-5.405a8.66%208.66%200%200%201%204.082-.934a8.67%208.67%200%200%201%205.43%202.027c.779-.78%201.562-1.56%202.34-2.344a12%2012%200%200%200-3.77-2.25a12%2012%200%200%200-4.19-.74zm9.047%204.076L18.67%206.418l.002.002a8.7%208.7%200%200%201%201.72%203.29a8.75%208.75%200%200%201-.046%204.742a8.7%208.7%200%200%201-1.678%203.13l2.342%202.341a12%2012%200%200%200%202.347-4.04a12.05%2012.05%200%200%200-.35-8.668a12%2012%200%200%200-1.995-3.138zm-8.91.21a7.7%207.7%200%200%200-2.965.55v.002q-.002%201.605%200%203.21L12%2010.913c.96-.954%201.912-1.91%202.87-2.867V4.838a7.7%207.7%200%200%200-2.768-.553zM8.045%209.13c-1.07.003-2.14-.003-3.209.004a7.77%207.77%200%200%200%20.004%205.733l3.203.002q1.439-1.434%202.873-2.872zm7.916%200c-.962.953-1.917%201.91-2.875%202.867V12q1.436%201.435%202.875%202.87h3.203a7.75%207.75%200%200%200%200-5.74c-1.068%200-2.135.004-3.203%200M12%2013.084L9.137%2015.95v3.211a7.72%207.72%200%200%200%205.734-.002v-3.203c-.957-.957-1.91-1.917-2.87-2.87z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M11.965%200a12%2012%200%200%200-4.28.8a12%2012%200%200%200-3.663%202.237A12%2012%200%200%200%20.22%2014.29a11.9%2011.9%200%200%200%201.93%204.565a12.04%2012.04%200%200%200%205.896%204.478a12.04%2012.04%200%200%200%208.793-.347a12%2012%200%200%200%203.082-1.97q-1.169-1.175-2.34-2.345a8.7%208.7%200%200%201-2.69%201.533a8.73%208.73%200%200%201-4.757.29a8.66%208.66%200%200%201-3.485-1.637a8.7%208.7%200%200%201-2.394-2.9a8.72%208.72%200%200%201-.629-6.31a8.73%208.73%200%200%201%204.447-5.405a8.66%208.66%200%200%201%204.082-.934a8.67%208.67%200%200%201%205.43%202.027c.779-.78%201.562-1.56%202.34-2.344a12%2012%200%200%200-3.77-2.25a12%2012%200%200%200-4.19-.74zm9.047%204.076L18.67%206.418l.002.002a8.7%208.7%200%200%201%201.72%203.29a8.75%208.75%200%200%201-.046%204.742a8.7%208.7%200%200%201-1.678%203.13l2.342%202.341a12%2012%200%200%200%202.347-4.04a12.05%2012.05%200%200%200-.35-8.668a12%2012%200%200%200-1.995-3.138zm-8.91.21a7.7%207.7%200%200%200-2.965.55v.002q-.002%201.605%200%203.21L12%2010.913c.96-.954%201.912-1.91%202.87-2.867V4.838a7.7%207.7%200%200%200-2.768-.553zM8.045%209.13c-1.07.003-2.14-.003-3.209.004a7.77%207.77%200%200%200%20.004%205.733l3.203.002q1.439-1.434%202.873-2.872zm7.916%200c-.962.953-1.917%201.91-2.875%202.867V12q1.436%201.435%202.875%202.87h3.203a7.75%207.75%200%200%200%200-5.74c-1.068%200-2.135.004-3.203%200M12%2013.084L9.137%2015.95v3.211a7.72%207.72%200%200%200%205.734-.002v-3.203c-.957-.957-1.91-1.917-2.87-2.87z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}给 opencritic 加一点动效
单文件 CSS 即可播放，无需任何依赖；描画动效仅对描边类图标生效。
呼吸
透明度往复渐变，适合状态提示与在线指示。
css呼吸动效样式
.icon-opencritic {
animation: icon-breathe 1.8s ease-in-out infinite;
}
@keyframes icon-breathe {
0%, 100% { opacity: 1; }
50% { opacity: 0.35; }
}旋转
匀速循环旋转，适合加载中场景。
css旋转动效样式
.icon-opencritic {
animation: icon-spin 1.6s linear infinite;
}
@keyframes icon-spin {
to { transform: rotate(360deg); }
}SVG 健康报告
对源文件的客观技术指标，供工程侧评估引用方式。
文件体积
1.23 KB
1,262 字节
viewBox
0 0 24 24
矢量坐标系
图元总数
1
<path> ×1
风格
单色（跟随 currentColor）
填充跟随容器颜色
同时含 width/height 与 viewBox：可以只保留 viewBox，让图标跟随容器自适应缩放。 文件体积 1.23 KB（1,262 字节），图元 1 个，风格为单色（跟随 currentColor）。
常见问题
关于 opencritic 图标的下载、商用与改色。
opencritic 图标是什么？▾
它是 Simple Icons（simple-icons）开源图标集中的 opencritic 图标，单色（跟随 currentColor），viewBox 为 0 0 24 24，文件仅 1.23 KB，矢量格式可无损缩放到任意尺寸。
如何下载 opencritic 图标？▾
点击「下载与导出」中的 SVG 源文件按钮保存矢量文件；也可以按 512 / 256 / 128 / 64 / 32 / 16px 预设导出 PNG，或在输入框填 16~1024 之间的任意尺寸。需要 iOS、Android 全套尺寸时，用素材包生成器一键打包。
opencritic 图标可以商用吗？▾
该图标采用 CC0 1.0（CC0-1.0） 开源协议，通常允许在遵守协议的前提下免费使用，常见要求是保留作者版权声明。商用前建议阅读协议原文确认。
如何修改 opencritic 图标的颜色？▾
在「预览与场景」的色板中切换颜色，三底色与全部场景会实时跟随；点击任一相近图标可打开预览弹层，复制对应颜色的 SVG 源码或 PNG。也可以复制 SVG 源码后自行修改 fill 值。