社会的 · 网络电话

social-skype

图标库: Simple line icons
作者: Sabbir Ahmed
许可: MIT ↗

正在读取图标颜色…

预览尺寸 96px

使用场景

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

按钮内

输入框

搜索社会的 · 网络电话...

导航

社会的 · 网络电话

空状态

暂无内容

场景预览

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

手机桌面 · App 图标

9:41

社会的 · 网络电话

浏览器 · 标签页与站点

ff6370703398d5fd.example

社会的 · 网络电话开始使用

操作按钮 · 主次层级

社会的 · 网络电话了解更多

底部导航 · Tab 栏

社会的 · 网络电话推荐收藏我的

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">
  <!-- 内联 社会的 · 网络电话 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">
  <!-- 内联 社会的 · 网络电话 SVG -->
  立即开始
</button>

React 组件

内联引入

react

import { IconIcon } from './icons';

function Nav() {
  return <IconIcon 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">
  <!-- 内联 社会的 · 网络电话 SVG -->
  已完成
</span>

输入框前缀

搜索框

搜索社会的 · 网络电话…

html

<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>

功能卡片

功能名称

功能的一句话说明。

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">
    <!-- 内联 社会的 · 网络电话 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-ff6370703398d5fd { stroke-dasharray: 1; animation: svg-draw 1.2s forwards; }

呼吸

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

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

旋转

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

.icon-ff6370703398d5fd { 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 一键导出；下载前可在下方「预览参数」改色，导出文件同步生效。

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

复制社会的 · 网络电话图标代码

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

svg

<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M977.768 574.454a488 488 0 0 0 4.868-68.74c0-261.78-212.91-474.894-474.894-474.894c-21.9 0-44.204 1.622-65.901 4.46C398.852 12.166 350.187 0 301.116 0C137.276 0 4.055 133.22 4.055 296.858c0 48.26 11.76 95.91 34.268 138.29c-3.447 23.32-5.272 47.044-5.272 70.566c0 261.779 212.91 474.894 474.894 474.894c18.452 0 37.107-1.014 55.357-3.244C610.954 1007.779 666.11 1024 723.087 1024c163.84 0 296.858-133.22 296.858-296.858c0-53.936-14.6-106.657-42.176-152.688zm-92.87 314.5c-43.19 43.19-100.777 67.118-162.015 67.118c-45.218 0-88.814-13.18-126.326-38.12l-16.83-11.153l-20.074 2.636c-17.034 2.23-34.472 3.244-51.708 3.244c-54.951 0-108.28-10.747-158.365-32.038c-48.463-20.48-92.059-49.883-129.368-87.193S153.5 712.543 133.019 664.08c-21.29-50.085-32.038-103.414-32.038-158.365c0-21.494 1.622-43.19 5.07-64.482l2.838-18.25l-8.921-16.222c-18.25-33.457-27.984-71.376-27.984-109.903c0-61.237 23.724-118.622 67.117-162.015c43.19-43.19 100.778-67.118 162.016-67.118c39.135 0 77.866 10.139 111.73 29.198l16.221 9.125l18.452-2.636c19.872-3.042 40.353-4.46 60.427-4.46c54.951 0 108.28 10.747 158.365 32.038c48.463 20.48 92.059 49.882 129.368 87.192s66.712 80.905 87.192 129.368c21.291 50.085 32.038 103.414 32.038 158.365c0 21.088-1.622 42.379-4.867 63.265l-3.042 19.872l10.747 17.236c22.508 36.296 34.471 78.067 34.471 120.853c-.203 61.034-24.13 118.622-67.32 161.812v.001zM578.714 461.51L482.6 439.816c-52.316-11.761-78.677-29.808-78.677-54.546c0-17.64 7.3-32.038 21.697-42.989s34.878-16.424 61.035-16.424c30.822 0 55.965 6.489 75.026 19.669c5.678 3.65 17.844 15.613 36.499 35.688c12.166 12.977 25.347 19.669 39.338 19.669c14.397 0 26.97-4.055 37.107-12.166c10.34-8.111 15.411-19.264 15.411-33.256q0-48.362-63.873-83.948c-40.15-22.508-84.15-33.66-132.006-33.66c-55.154 0-100.98 11.76-137.48 35.08c-42.582 27.577-63.873 67.32-63.873 119.027c0 70.97 41.163 117 123.488 137.885l129.774 32.848c32.646 8.315 49.07 25.955 49.07 52.519c0 17.844-7.908 32.849-23.724 45.42c-17.236 13.992-40.15 21.089-68.537 21.089q-49.578 0-79.69-23.725c-4.665-3.244-17.44-17.641-38.325-43.393c-12.976-15.817-27.78-23.725-44-23.725q-20.988 0-34.675 13.383c-13.687 13.383-13.585 20.277-13.585 34.269q0 47.752 51.1 83.947c39.541 28.997 92.87 43.394 159.38 43.394c67.117 0 118.824-15.208 155.323-45.624c34.47-27.983 51.707-6
…

预览参数

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

颜色

风格变体

细线 · 1.2px · 密集布局

常规 · 2px · 通用界面

加粗 · 3.5px · 大尺寸标题

关于社会的 · 网络电话图标

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

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

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

常见问题

社会的 · 网络电话图标是什么？

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

如何下载社会的 · 网络电话图标？

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

社会的 · 网络电话图标可以商用吗？

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

如何修改社会的 · 网络电话图标的颜色？

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

SVG 健康报告

100/100

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

文件体积

2.47 KB

2,525 字节

viewBox

0 0 1024 1024

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

图元总数

<path> ×1

风格

单色轮廓

无显式填色，跟随容器 currentColor

图标信息摘要

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

继续探索