ICONYZ
Bahasa Indonesia
Ikon Hoppscotch dari theSVG Color

Ikon Hoppscotch

thesvg-color:hoppscotch

Ikon Hoppscotch (thesvg-color:hoppscotch) adalah ikon SVG gratis dari set theSVG Color karya thesvg.org. Ikon ini digambar pada grid 748 × 500. theSVG Color icons dirilis di bawah lisensi MIT, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial. Salin sebagai kode SVG, JSX, Vue, atau Svelte, atau unduh file SVG-nya.

Set ikon
theSVG Color
Pembuat
thesvg.org
Lisensi
MIT
Ukuran
748 × 500
Download SVG

Kode SVG

<svg xmlns="http://www.w3.org/2000/svg" width="748" height="500" viewBox="0 0 748 500"><g fill="none"><path fill="#00b381" d="M481.331 472.1c-60.011 33.411-132.958 37.478-197.829 8.596s-110.709-85.875-126.018-152.782c45.291 28.678 98.635 56.838 157.138 82.885s115.06 46.818 166.709 61.301" opacity=".6"/><path fill="url(#SVGo3Axrd4o)" d="M403.097 313.899c-7.476 16.791-30.487 22.856-51.397 13.547c-20.909-9.31-31.8-30.469-24.324-47.261c7.476-16.791 30.488-22.856 51.397-13.547c20.91 9.31 31.8 30.469 24.324 47.261"/><path fill="url(#SVGqdshachE)" d="M403.097 313.899c-7.476 16.791-30.487 22.856-51.397 13.547c-20.909-9.31-31.8-30.469-24.324-47.261c7.476-16.791 30.488-22.856 51.397-13.547c20.91 9.31 31.8 30.469 24.324 47.261"/><path fill="url(#SVGo3Axrd4o)" d="M528.347 386.39c21.89 6.277 43.722-2.883 48.761-20.458c5.04-17.576-8.62-36.912-30.511-43.189s-43.721 2.883-48.761 20.458c-5.039 17.576 8.621 36.912 30.511 43.189"/><path fill="url(#SVGqdshachE)" d="M528.347 386.39c21.89 6.277 43.722-2.883 48.761-20.458c5.04-17.576-8.62-36.912-30.511-43.189s-43.721 2.883-48.761 20.458c-5.039 17.576 8.621 36.912 30.511 43.189"/><path fill="url(#SVGo3Axrd4o)" d="M224.775 179.46c19.312 12.068 27.114 34.42 17.425 49.926s-33.199 18.292-52.511 6.225s-27.114-34.42-17.425-49.926s33.199-18.292 52.511-6.225"/><path fill="url(#SVGqdshachE)" d="M224.775 179.46c19.312 12.068 27.114 34.42 17.425 49.926s-33.199 18.292-52.511 6.225s-27.114-34.42-17.425-49.926s33.199-18.292 52.511-6.225"/><path fill="url(#SVGo3Axrd4o)" fill-rule="evenodd" d="M486.721 24.178c98.796 43.987 162.233 139.915 164.791 247.086c58.163 45.759 115.969 109.806 89.109 170.133c-43.559 97.835-248.585 48.351-426.014-30.645C137.178 331.755-36.785 212.503 6.775 114.667c26.859-60.327 113.134-60.224 186.059-47.62c81.355-69.81 195.091-86.855 293.887-42.869M57.981 137.466c-14.634 32.868 64.039 126.184 279.425 222.08c215.385 95.895 337.375 91.92 352.009 59.053c12.112-27.204-38.057-85.319-94.847-120.037c-1.739-1.063-4.164-2.569-7.201-4.455c-27.65-17.168-105.958-65.791-177.473-97.631c-21.602-9.618-30.044-35.273-20.968-55.66s29.027-34.014 71.033-35.943c19.773-.055 22.366-5.535 23.269-10.233c1.118-7.248-9.16-14.739-19.305-19.256c-82.442-36.705-183.347-21.348-253.273 52.247c-68.341-15.319-140.558-17.368-152.67 9.835" clip-rule="evenodd"/><path fill="url(#SVGqdshachE)" fill-rule="evenodd" d="M486.721 24.178c98.796 43.987 162.233 139.915 164.791 247.086c58.163 45.759 115.969 109.806 89.109 170.133c-43.559 97.835-248.585 48.351-426.014-30.645C137.178 331.755-36.785 212.503 6.775 114.667c26.859-60.327 113.134-60.224 186.059-47.62c81.355-69.81 195.091-86.855 293.887-42.869M57.981 137.466c-14.634 32.868 64.039 126.184 279.425 222.08c215.385 95.895 337.375 91.92 352.009 59.053c12.112-27.204-38.057-85.319-94.847-120.037c-1.739-1.063-4.164-2.569-7.201-4.455c-27.65-17.168-105.958-65.791-177.473-97.631c-21.602-9.618-30.044-35.273-20.968-55.66s29.027-34.014 71.033-35.943c19.773-.055 22.366-5.535 23.269-10.233c1.118-7.248-9.16-14.739-19.305-19.256c-82.442-36.705-183.347-21.348-253.273 52.247c-68.341-15.319-140.558-17.368-152.67 9.835" clip-rule="evenodd"/><defs><radialGradient id="SVGqdshachE" cx="0" cy="0" r="1" gradientTransform="rotate(191.75 374.853 100.865)scale(778.304 379.214)" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></radialGradient><linearGradient id="SVGo3Axrd4o" x1="373.698" x2="373.698" y1="0" y2="495.636" gradientUnits="userSpaceOnUse"><stop stop-color="#00d196"/><stop offset="1" stop-color="#00b381"/></linearGradient></defs></g></svg>

Cara memakai ikon Hoppscotch

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

Gambar HTML

<img src="https://iconyz.com/api/public/svg/thesvg-color/hoppscotch.svg" alt="Ikon Hoppscotch" width="24" height="24">

Ikon Hoppscotch di set ikon lain

FAQ Ikon Hoppscotch

Apakah ikon Hoppscotch gratis untuk penggunaan komersial?

Ya. theSVG Color icons dirilis di bawah lisensi MIT, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial.

Bagaimana cara memakai ikon Hoppscotch di React?

Pasang @iconify/react lalu render <Icon icon="thesvg-color:hoppscotch" />, atau gunakan “Salin kode” di halaman ini untuk mendapatkan komponen React mandiri.

Bagaimana cara menambahkan ikon Hoppscotch ke halaman web?

Tautkan file SVG di tag gambar: <img src="https://iconyz.com/api/public/svg/thesvg-color/hoppscotch.svg" alt="Ikon Hoppscotch">, atau tempel kode SVG langsung di halaman untuk menatanya dengan CSS.

Lihat semua Ikon theSVG Color →