Network Connectivity Center アイコン
gcp:network-connectivity-center
Network Connectivity Center アイコン(gcp:network-connectivity-center)は、Google Cloud Icons セットの無料 SVG アイコンです（作者: Google Cloud）。 24 × 24 のグリッドで描かれています。 Google Cloud Icons は Apache 2.0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Google Cloud Icons
- 作者
- Google Cloud
- ライセンス
- Apache-2.0
- サイズ
- 24 × 24
- タグ
- networkconnectivity、connectivitycenter、networkconnectivitycenter
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="#4285f4" d="M8.36 7.8a4.4 4.4 0 0 0-.54.52l-.23-.23l-.88-.88l.53-.53l.88.88Zm8.96 8.96l-.53.53l-1.09-1.1a4.3 4.3 0 0 0 .53-.52ZM6.58 11.6a2.6 2.6 0 0 0 0 .4a2 2 0 0 0 0 .35H4.87v-.75Zm12.55 0v.75h-1.66v-.75ZM7.79 15.65a4.4 4.4 0 0 0 .53.53l-1.11 1.11l-.53-.53Zm8.11-8.11l.86-.86l.53.53L16.2 8.3a4.4 4.4 0 0 0-.53-.53ZM12 17.47h.38v1.67h-.75v-1.69Zm.4-12.6v1.69a2 2 0 0 0-.34 0a3 3 0 0 0-.4 0V4.87Z"/><path fill="#669df6" fill-rule="evenodd" d="M17.92 11.6a5.88 5.88 0 0 0-1.49-3.53a5 5 0 0 0-.54-.52A5.8 5.8 0 0 0 12.4 6.1h-.77a5.84 5.84 0 0 0-3.51 1.46a7 7 0 0 0-.53.53a5.9 5.9 0 0 0-1.47 3.51v.75a5.9 5.9 0 0 0 1.44 3.53a5 5 0 0 0 .53.53a5.9 5.9 0 0 0 3.56 1.49h.75a5.9 5.9 0 0 0 3.52-1.47a4.4 4.4 0 0 0 .53-.53a5.83 5.83 0 0 0 1.47-3.55V12c0-.12.01-.27 0-.4M12 17.16A5.16 5.16 0 1 1 17.16 12A5.16 5.16 0 0 1 12 17.16m0-9.09A3.93 3.93 0 1 0 16 12a3.94 3.94 0 0 0-4-3.93"/><path fill="#aecbfa" fill-rule="evenodd" d="M12 5a1.4 1.4 0 0 1 0-2.79V3a.65.65 0 0 0 0 1.29Z"/><path fill="#669df6" fill-rule="evenodd" d="M12 5v-.71A.65.65 0 0 0 12 3v-.75A1.4 1.4 0 0 1 12 5"/><path fill="#aecbfa" fill-rule="evenodd" d="M12 21.75A1.4 1.4 0 0 1 12 19v.75A.65.65 0 0 0 12 21Z"/><path fill="#669df6" fill-rule="evenodd" d="M12 21.75V21a.65.65 0 0 0 0-1.29V19a1.4 1.4 0 0 1 0 2.79Z"/><path fill="#aecbfa" fill-rule="evenodd" d="M6.09 7.48a1.39 1.39 0 1 1 0-2.78v.75a.64.64 0 0 0-.64.64a.64.64 0 0 0 .64.64Z"/><path fill="#669df6" fill-rule="evenodd" d="M6.09 7.48v-.75a.64.64 0 0 0 0-1.28V4.7a1.39 1.39 0 1 1 0 2.78"/><path fill="#aecbfa" fill-rule="evenodd" d="M17.91 19.3a1.39 1.39 0 0 1 0-2.78v.75a.64.64 0 0 0 0 1.28Z"/><path fill="#669df6" fill-rule="evenodd" d="M17.91 19.3v-.75a.64.64 0 0 0 .64-.64a.64.64 0 0 0-.64-.64v-.75a1.39 1.39 0 0 1 0 2.78"/><path fill="#aecbfa" fill-rule="evenodd" d="M3.64 13.39a1.39 1.39 0 0 1 0-2.78v.75a.64.64 0 1 0 0 1.28Z"/><path fill="#669df6" fill-rule="evenodd" d="M3.64 13.39v-.75a.64.64 0 1 0 0-1.28v-.75a1.39 1.39 0 1 1 0 2.78"/><path fill="#aecbfa" fill-rule="evenodd" d="M20.36 13.39a1.38 1.38 0 0 1-1-.4A1.43 1.43 0 0 1 19 12a1.4 1.4 0 0 1 1.4-1.39v.75a.65.65 0 0 0-.65.64a.64.64 0 0 0 .19.45a.6.6 0 0 0 .46.19Z"/><path fill="#669df6" fill-rule="evenodd" d="M20.36 13.39v-.75a.64.64 0 0 0 0-1.28v-.75a1.39 1.39 0 0 1 0 2.78"/><path fill="#aecbfa" fill-rule="evenodd" d="M6.06 19.3a1.4 1.4 0 0 1-1-.42a1.33 1.33 0 0 1-.38-1a1.44 1.44 0 0 1 1.45-1.38v.75a.69.69 0 0 0-.7.65a.57.57 0 0 0 .17.44a.67.67 0 0 0 .47.19Z"/><path fill="#669df6" fill-rule="evenodd" d="M6.06 19.3v-.75a.69.69 0 0 0 .7-.65a.56.56 0 0 0-.17-.44a.67.67 0 0 0-.47-.19v-.75a1.4 1.4 0 0 1 1 .42a1.32 1.32 0 0 1 .38 1a1.44 1.44 0 0 1-1.44 1.36"/><path fill="#aecbfa" fill-rule="evenodd" d="M17.91 7.48a1.39 1.39 0 0 1 0-2.78v.75a.64.64 0 1 0 0 1.28Z"/><path fill="#669df6" fill-rule="evenodd" d="M17.91 7.48v-.75a.64.64 0 0 0 .64-.64a.64.64 0 0 0-.64-.64V4.7a1.39 1.39 0 1 1 0 2.78"/><path fill="#aecbfa" fill-rule="evenodd" d="M12 8.07v7.85a3.93 3.93 0 1 1 0-7.85"/><path fill="#669df6" fill-rule="evenodd" d="M16 12a3.92 3.92 0 0 1-4 3.92V8.07A3.93 3.93 0 0 1 16 12"/><path fill="#aecbfa" d="M12.02 13.04h2.11v.75h-2.11zm0-1.37h2.11v.75h-2.11zm0-1.36h2.11v.75h-2.11z"/><path fill="#fff" d="M9.91 13.04h2.11v.75H9.91zm0-1.37h2.11v.75H9.91zm0-1.36h2.11v.75H9.91z"/></svg>Network Connectivity Center アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="gcp:network-connectivity-center" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="gcp:network-connectivity-center" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="gcp:network-connectivity-center" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[gcp--network-connectivity-center]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/gcp -->
<div class="i-gcp:network-connectivity-center"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="gcp:network-connectivity-center"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/gcp/network-connectivity-center.svg" alt="Network Connectivity Center アイコン" width="24" height="24">Google Cloud Icons の関連アイコン
Network Connectivity Center アイコン のよくある質問
Network Connectivity Center アイコンは商用利用でも無料ですか?
はい。Google Cloud Icons は Apache 2.0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Network Connectivity Center アイコンを使うには?
@iconify/react をインストールして <Icon icon="gcp:network-connectivity-center" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Network Connectivity Center アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/gcp/network-connectivity-center.svg" alt="Network Connectivity Center アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。