ICONYZ
日本語
theSVG Color の Cogview アイコン

Cogview アイコン

thesvg-color:cogview

Cogview アイコン(thesvg-color:cogview)は、theSVG Color セットの無料 SVG アイコンです(作者: thesvg.org)。 24 × 24 のグリッドで描かれています。 theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット
theSVG Color
作者
thesvg.org
ライセンス
MIT
サイズ
24 × 24
SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="url(#SVGfeucEehp)" d="m15.271 16.555l5.72 4.877s-3.276 3.125-7.223-2.866z"/><path fill="url(#SVGIXkGvdWu)" d="m15.4 16.523l4.596 5.947s-3.85 2.39-6.477-4.293l1.882-1.654z"/><path fill="url(#SVGdXO9zcHv)" d="M13.833 21.043h-3.72a.44.44 0 0 1-.41-.27L2.024 2.94c-.087-.194.065-.421.28-.421H6.07c.184 0 .346.108.41.27l7.635 17.831a.307.307 0 0 1-.281.422z"/><path fill="url(#SVGQxECmb6f)" d="M7.637 3.547c-2.087.562-2.855 2.465-2.855 2.465s1.33-.465 3.18-.876a30 30 0 0 1 2.551-.421c-.043-.617-1.276-1.6-2.876-1.168"/><path fill="url(#SVG9RQWL85n)" d="M6.664 5.05c-1.644 1.416-1.6 3.46-1.6 3.46s.94-.908 2.357-2.163c.951-.843 2.032-1.6 2.032-1.6c-.335-.519-1.47-.833-2.79.303z"/><path fill="url(#SVGDz0xrc7c)" d="M6.307 7.18c-1.363 1.665-1.05 3.385-1.05 3.385s.801-.768 2.001-2.217a31 31 0 0 1 1.763-1.892C8.61 6 7.388 5.872 6.307 7.18"/><path fill="url(#SVGsQwbgsPl)" d="M14.957 4.141s-.41-1.07-1.254-1.535c-.822-.454-3.028-.552-4.585.616c-2.065 1.536-2.768 4.044-2.92 4.64c-1.492 5.795 1.558 9.06 4.942 10.64l3.817-14.36z"/><path fill="url(#SVGcyggbbcD)" d="M4.912 11.246a7.404 7.404 0 0 0 7.558 7.245l-.313-14.814c-4.088.097-7.332 3.481-7.245 7.569"/><path fill="url(#SVG737whcix)" d="M6.296 12.62c.443 4.032 4.087 6.941 8.12 6.498l-1.621-14.62a7.366 7.366 0 0 0-6.499 8.121z"/><path fill="url(#SVGJueAQ0oV)" d="M9.313 3.785a3.107 3.107 0 0 0-.097 4.195a3.126 3.126 0 0 0 4.174.487z"/><path fill="url(#SVGD1Ha1d0J)" d="M11.79 8.077a2.909 2.909 0 1 0 0-5.817a2.909 2.909 0 0 0 0 5.817"/><path fill="url(#SVGVsUcvdWt)" d="M8.729 13.625c1.016 3.233 4.466 5.039 7.699 4.022L12.751 5.926a6.14 6.14 0 0 0-4.022 7.699"/><path fill="url(#SVGGB07DbXj)" d="M9.562 12.079a5.306 5.306 0 0 0 6.239 4.173L13.725 5.84c-2.866.563-4.736 3.363-4.163 6.24z"/><path fill="url(#SVG95rAxJfZ)" d="M11.075 2.822s-.648 1.125-.291 2.38c.443 1.556 2.097 1.783 2.8 1.61l1.006-2.108l-1.763-2.358z"/><path fill="url(#SVGS3E86bRA)" d="M12.903 5.807s-.54.162-.887.81c-.292.541-.205 1.287-.205 1.287l2.195-1.686z"/><path fill="url(#SVGqQcdTbDc)" d="M15.325 9.97S13.465 9.948 13 8.218c-.313-1.178.249-1.99.249-1.99l1.211-.356z"/><path fill="url(#SVGwlTVQbpJ)" d="M7.02.757s.4 1.849 2.412 2.595c1.524.562 4.076-.973 4.076-.973s-1.34-.552-3.33-.552C8.686 1.827 7.02.757 7.02.757"/><path fill="url(#SVG6pcMOeHX)" d="M16.904 4.671s.238-1.243-.552-2.4c-.605-.887-2.12-1.882-4.93-1.265C9.053 1.525 8.697 0 8.697 0c-.076.39.183 2.92 2.649 2.552c3.027-.454 2.768 2.509 3.838 3.006c.887.39 1.72-.887 1.72-.887"/><path fill="url(#SVGOCd3ZdIb)" d="M13.757 6.412a1.492 1.492 0 1 0 0-2.984a1.492 1.492 0 0 0 0 2.984"/><path fill="url(#SVG6YENOe6H)" d="M10.059 21.043h3.828a.44.44 0 0 0 .41-.27L21.976 2.94c.087-.194-.065-.421-.28-.421h-3.872a.44.44 0 0 0-.411.27L9.778 20.62a.307.307 0 0 0 .281.422z"/><path fill="url(#SVGuHKDucHv)" d="M10.059 21.043h3.828a.44.44 0 0 0 .41-.27l6.1-14.144a.306.306 0 0 0-.282-.422h-3.87a.44.44 0 0 0-.412.27L9.778 20.621a.307.307 0 0 0 .281.422"/><path fill="url(#SVGH6Ujld3W)" d="M16.071 4.888s.054-1.795-1.806-2.736c-2.595-1.309-4.974 1.795-7.699 0c0 0 .552 2.768 6.11 1.72c1.373-.26 1.979.172 2.281.67c.26.421.238.789.238 1.005l.876-.66z"/><path fill="url(#SVGykc4Kcjj)" d="M15.671 5.223s.14-.973-.67-1.568c-.876-.638-1.58-.508-1.58-.508s.498-.303 1.212-.303c.379 0 .508-.054.508-.054s.054-.173-.184-.444c2.033.898 1.503 2.433 1.503 2.433z"/><path fill="url(#SVGLwSxQdBj)" d="M16.352 6.856s-.8.746-1.946.356c-.076-.021-.065-.475 0-.767c.065-.336.292-.703.476-.93c1.243.108 1.47 1.34 1.47 1.34z"/><path fill="url(#SVGskjdIbbh)" d="M16.904 4.596s.616.962.432 2.054c-.216 1.265-1.416 1.86-1.416 1.86s.573-2.206-1.05-2.995c0 0 .336-.368.823-.595c.713-.324 1.21-.324 1.21-.324z"/><path fill="url(#SVGyuDGde7K)" d="M13.52 5.504a.724.724 0 1 0 0-1.449a.724.724 0 0 0 0 1.449"/><path fill="url(#SVG0AhNYbHO)" d="M13.357 5.169c.257 0 .465-.223.465-.498c0-.274-.208-.497-.465-.497s-.465.223-.465.497c0 .275.208.498.465.498"/><path fill="#fff" d="M13.681 4.423a.108.108 0 1 0 0-.217a.108.108 0 0 0 0 .217"/><defs><linearGradient id="SVGfeucEehp" x1="14.07" x2="20.313" y1="18.852" y2="20.083" gradientUnits="userSpaceOnUse"><stop offset=".006" stop-color="#e8096a"/><stop offset="1" stop-color="#00afff"/></linearGradient><linearGradient id="SVGdXO9zcHv" x1="11.764" x2="3.911" y1="20.533" y2="1.932" gradientUnits="userSpaceOnUse"><stop stop-color="#412df5"/><stop offset=".691" stop-color="#0606b6"/><stop offset="1" stop-color="#4b00b4"/></linearGradient><linearGradient id="SVGQxECmb6f" x1="5.23" x2="8.449" y1="4.866" y2="4.518" gradientUnits="userSpaceOnUse"><stop stop-color="#e60030"/><stop offset="1" stop-color="#690040"/></linearGradient><linearGradient id="SVG9RQWL85n" x1="5.359" x2="7.933" y1="6.753" y2="6.013" gradientUnits="userSpaceOnUse"><stop stop-color="#ff6500"/><stop offset="1" stop-color="#ee182c"/></linearGradient><linearGradient id="SVGDz0xrc7c" x1="5.528" x2="8.59" y1="8.108" y2="8.699" gradientUnits="userSpaceOnUse"><stop stop-color="#ea4d07"/><stop offset="1" stop-color="#c5171e"/></linearGradient><linearGradient id="SVGsQwbgsPl" x1="12.023" x2="7.057" y1="3.007" y2="18.02" gradientUnits="userSpaceOnUse"><stop stop-color="#0091ff"/><stop offset=".005" stop-color="#0292fc"/><stop offset=".126" stop-color="#37a5c2"/><stop offset=".249" stop-color="#65b58e"/><stop offset=".372" stop-color="#8cc363"/><stop offset=".496" stop-color="#accf3f"/><stop offset=".62" stop-color="#c4d823"/><stop offset=".745" stop-color="#d6de10"/><stop offset=".871" stop-color="#e1e204"/><stop offset="1" stop-color="#e4e300"/></linearGradient><linearGradient id="SVGcyggbbcD" x1="6.803" x2="13.616" y1="4.807" y2="18.4" gradientUnits="userSpaceOnUse"><stop offset=".006" stop-color="#de003b"/><stop offset=".241" stop-color="#d976ff"/><stop offset="1" stop-color="#00a4ea"/></linearGradient><linearGradient id="SVGVsUcvdWt" x1="11.435" x2="12.609" y1="7.86" y2="16.15" gradientUnits="userSpaceOnUse"><stop stop-color="#ff9500"/><stop offset="1" stop-color="#f7ff2b"/></linearGradient><linearGradient id="SVGGB07DbXj" x1="15.495" x2="10.596" y1="13.571" y2="8.476" gradientUnits="userSpaceOnUse"><stop offset=".207" stop-color="#ff8e00"/><stop offset="1" stop-color="#f41b56"/></linearGradient><linearGradient id="SVGS3E86bRA" x1="12.031" x2="12.816" y1="7.438" y2="6.584" gradientUnits="userSpaceOnUse"><stop stop-color="#ffb41f"/><stop offset="1" stop-color="#f42a56"/></linearGradient><linearGradient id="SVGqQcdTbDc" x1="13.472" x2="14.931" y1="9.574" y2="6.928" gradientUnits="userSpaceOnUse"><stop stop-color="#ffb900"/><stop offset="1" stop-color="#f41880"/></linearGradient><linearGradient id="SVG6pcMOeHX" x1="8.686" x2="16.938" y1="2.816" y2="2.816" gradientUnits="userSpaceOnUse"><stop stop-color="#ff6500"/><stop offset="1" stop-color="#ee182c"/></linearGradient><linearGradient id="SVG6YENOe6H" x1="10.556" x2="21.346" y1="21.192" y2="2.03" gradientUnits="userSpaceOnUse"><stop stop-color="#008dff"/><stop offset=".181" stop-color="#331dea"/><stop offset=".833" stop-color="#39c3fe"/><stop offset="1" stop-color="#60f5a9"/></linearGradient><linearGradient id="SVGykc4Kcjj" x1="14.947" x2="15.001" y1="2.631" y2="4.948" gradientUnits="userSpaceOnUse"><stop stop-color="#e60030"/><stop offset="1" stop-color="#690040"/></linearGradient><linearGradient id="SVGLwSxQdBj" x1="15.335" x2="15.426" y1="7.144" y2="5.699" gradientUnits="userSpaceOnUse"><stop stop-color="#ffd71f"/><stop offset="1" stop-color="#dd001b"/></linearGradient><linearGradient id="SVGskjdIbbh" x1="15.25" x2="17.127" y1="6.472" y2="6.603" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff4c00"/><stop offset="1" stop-color="#ffff1e"/></linearGradient><radialGradient id="SVGIXkGvdWu" cx="0" cy="0" r="1" gradientTransform="rotate(5.75 -186.105 166.894)scale(6.42878)" gradientUnits="userSpaceOnUse"><stop stop-color="#00caff"/><stop offset="1" stop-color="#38e700"/></radialGradient><radialGradient id="SVG737whcix" cx="0" cy="0" r="1" gradientTransform="rotate(-6.338 87.254 -95.948)scale(11.4818)" gradientUnits="userSpaceOnUse"><stop stop-color="#00dfff"/><stop offset="1" stop-color="#abe700"/></radialGradient><radialGradient id="SVGJueAQ0oV" cx="0" cy="0" r="1" gradientTransform="rotate(-40.957 13.589 -11.156)scale(2.76891)" gradientUnits="userSpaceOnUse"><stop stop-color="#0068ff"/><stop offset="1" stop-color="#9ce830"/></radialGradient><radialGradient id="SVGD1Ha1d0J" cx="0" cy="0" r="1" gradientTransform="translate(11.79 5.169)scale(2.91494)" gradientUnits="userSpaceOnUse"><stop stop-color="#008a43"/><stop offset="1" stop-color="#a3e830"/></radialGradient><radialGradient id="SVG95rAxJfZ" cx="0" cy="0" r="1" gradientTransform="translate(13.404 4.87)scale(2.39805)" gradientUnits="userSpaceOnUse"><stop stop-color="red"/><stop offset="1" stop-color="#ff0"/></radialGradient><radialGradient id="SVGwlTVQbpJ" cx="0" cy="0" r="1" gradientTransform="rotate(-9.492 18.79 -57.53)scale(3.31553)" gradientUnits="userSpaceOnUse"><stop offset=".001" stop-color="#72003f"/><stop offset="1" stop-color="#ca1d67"/></radialGradient><radialGradient id="SVGOCd3ZdIb" cx="0" cy="0" r="1" gradientTransform="translate(13.777 4.91)scale(1.18046)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#d1dee7"/><stop offset="1" stop-color="#fff"/></radialGradient><radialGradient id="SVGuHKDucHv" cx="0" cy="0" r="1" gradientTransform="rotate(203.84 9.63 6.572)scale(2.7555 7.64116)" gradientUnits="userSpaceOnUse"><stop offset=".001" stop-color="#7f06fb"/><stop offset="1" stop-color="#7a10fb" stop-opacity="0"/></radialGradient><radialGradient id="SVGH6Ujld3W" cx="0" cy="0" r="1" gradientTransform="translate(7.1 2.821)scale(8.64049)" gradientUnits="userSpaceOnUse"><stop offset=".001" stop-color="#ff0042"/><stop offset=".422" stop-color="#0068ff"/><stop offset=".659" stop-color="#1877e2"/><stop offset="1" stop-color="#4eefbe"/></radialGradient><radialGradient id="SVGyuDGde7K" cx="0" cy="0" r="1" gradientTransform="translate(13.173 4.8)scale(.9051)" gradientUnits="userSpaceOnUse"><stop stop-color="#ff9100"/><stop offset=".226" stop-color="#ff9500"/><stop offset=".443" stop-color="#fea000"/><stop offset=".657" stop-color="#fcb400"/><stop offset=".867" stop-color="#f9cf00"/><stop offset="1" stop-color="#f7e400"/></radialGradient><radialGradient id="SVG0AhNYbHO" cx="0" cy="0" r="1" gradientTransform="translate(13.13 4.64)scale(.97336)" gradientUnits="userSpaceOnUse"><stop/><stop offset=".092" stop-color="#000004"/><stop offset=".177" stop-color="#01000f"/><stop offset=".258" stop-color="#020021"/><stop offset=".338" stop-color="#03003c"/><stop offset=".417" stop-color="#05005d"/><stop offset=".494" stop-color="#080087"/><stop offset=".571" stop-color="#0a00b8"/><stop offset=".645" stop-color="#0e00f0"/><stop offset=".654" stop-color="#0e00f7"/></radialGradient></defs></svg>

Cogview アイコンの使い方

React

import { Icon } from "@iconify/react";

<Icon icon="thesvg-color:cogview" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="thesvg-color:cogview" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="thesvg-color:cogview" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--cogview]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:cogview"></div>

Web コンポーネント

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="thesvg-color:cogview"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/thesvg-color/cogview.svg" alt="Cogview アイコン" width="24" height="24">

Cogview アイコン のよくある質問

Cogview アイコンは商用利用でも無料ですか?

はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。

React で Cogview アイコンを使うには?

@iconify/react をインストールして <Icon icon="thesvg-color:cogview" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。

Cogview アイコンをウェブページに追加するには?

画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/cogview.svg" alt="Cogview アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。

theSVG Color アイコン をすべて見る →