Иконка Hoppscotch

devicon:hoppscotch

Иконка Hoppscotch (devicon:hoppscotch) — бесплатная SVG-иконка из набора Devicon от konpa. Она нарисована на сетке 128 × 128. Devicon icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах. Скопируйте её как код SVG, JSX, Vue или Svelte или скачайте SVG-файл.

Набор: Devicon
Автор: konpa
Лицензия: MIT
Размер: 128 × 128

Скачать SVG

Код SVG

<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><defs><radialGradient id="SVGewDvpbhn" cx="0" cy="0" r="1" gradientTransform="rotate(125.613 62.77 33.464)scale(169.2567 188.01399)" gradientUnits="userSpaceOnUse"><stop stop-color="#00d196" stop-opacity=".5"/><stop offset=".997" stop-color="#00d196" stop-opacity="0"/></radialGradient><radialGradient id="SVGV7qKFYZZ" cx="0" cy="0" r="1" gradientTransform="rotate(159.984 45.353 35.593)scale(98.07689 59.8268)" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></radialGradient><linearGradient id="SVGxJS0pekx" x1="411.893" x2="411.893" y1="212" y2="612" gradientUnits="userSpaceOnUse"><stop stop-color="#00d196"/><stop offset="1" stop-color="#00b381"/></linearGradient><linearGradient id="SVG8zNPwqyr" x1="411.893" x2="411.893" y1="212" y2="612" gradientTransform="scale(.15534)" gradientUnits="userSpaceOnUse" href="#SVGxJS0pekx"/></defs><rect width="128" height="128" fill="#08110f" rx="28.583"/><rect width="128" height="128" fill="url(#SVGewDvpbhn)" fill-opacity=".5" rx="28.583"/><path fill="url(#SVG8zNPwqyr)" d="M63.752 32.934a34.44 34.44 0 0 0-22.236 8.34c-9.06-1.565-19.78-1.576-23.12 5.925c-3.745 8.411 5.438 18.094 18.747 26.512c1.884 8.139 7.43 15.329 15.625 18.977s17.253 2.959 24.556-1.084c15.162 4.256 28.501 4.601 32.246-3.811c3.34-7.5-3.841-15.461-11.066-21.148a34.41 34.41 0 0 0-20.469-30.711a34.5 34.5 0 0 0-14.283-3m.842 6.996c3.638.075 7.246.875 10.607 2.37c1.288.574 2.539 1.492 2.399 2.393c-.111.583-.436 1.266-2.893 1.274c-5.22.24-7.697 1.937-8.826 4.47c-1.128 2.535-.082 5.723 2.601 6.918c9.862 4.391 17.423 8.74 22.942 12.684c7.096 5.038 13.29 11.539 11.785 14.922c-1.82 4.086-16.978 4.585-43.738-7.328C32.71 65.718 22.938 54.118 24.758 50.03h.002c1.505-3.382 10.477-3.128 18.969-1.226c5.431-5.72 12.366-8.612 19.304-8.864q.78-.027 1.56-.011zM42.447 54.313c-1.457-.026-2.777.562-3.492 1.707c-1.205 1.927-.236 4.707 2.164 6.207s5.322 1.15 6.526-.778s.235-4.705-2.165-6.205c-.975-.61-2.036-.914-3.033-.931m19.725 11.226c-1.751-.013-3.3.794-3.94 2.229c-.93 2.088.422 4.718 3.02 5.875c2.597 1.156 5.457.4 6.387-1.688s-.424-4.717-3.022-5.873a6.1 6.1 0 0 0-2.445-.543m21.53 7.262c-2.046.014-3.808 1.084-4.298 2.79c-.626 2.186 1.07 4.588 3.79 5.368s5.433-.36 6.06-2.545s-1.07-4.588-3.79-5.367a6.3 6.3 0 0 0-1.763-.246z"/><path fill="url(#SVGV7qKFYZZ)" d="M63.752 32.934a34.44 34.44 0 0 0-22.236 8.34c-9.06-1.565-19.78-1.576-23.12 5.925c-3.745 8.411 5.438 18.094 18.747 26.512c1.884 8.139 7.43 15.329 15.625 18.977s17.253 2.959 24.556-1.084c15.162 4.256 28.501 4.601 32.246-3.811c3.34-7.5-3.841-15.461-11.066-21.148a34.41 34.41 0 0 0-20.469-30.711a34.5 34.5 0 0 0-14.283-3m.842 6.996c3.638.075 7.246.875 10.607 2.37c1.288.574 2.539 1.492 2.399 2.393c-.111.583-.436 1.266-2.893 1.274c-5.22.24-7.697 1.937-8.826 4.47c-1.128 2.535-.082 5.723 2.601 6.918c9.862 4.391 17.423 8.74 22.942 12.684c7.096 5.038 13.29 11.539 11.785 14.922c-1.82 4.086-16.978 4.585-43.738-7.328C32.71 65.718 22.938 54.118 24.758 50.03h.002c1.505-3.382 10.477-3.128 18.969-1.226c5.431-5.72 12.366-8.612 19.304-8.864q.78-.027 1.56-.011zM42.447 54.313c-1.457-.026-2.777.562-3.492 1.707c-1.205 1.927-.236 4.707 2.164 6.207s5.322 1.15 6.526-.778s.235-4.705-2.165-6.205c-.975-.61-2.036-.914-3.033-.931m19.725 11.226c-1.751-.013-3.3.794-3.94 2.229c-.93 2.088.422 4.718 3.02 5.875c2.597 1.156 5.457.4 6.387-1.688s-.424-4.717-3.022-5.873a6.1 6.1 0 0 0-2.445-.543m21.53 7.262c-2.046.014-3.808 1.084-4.298 2.79c-.626 2.186 1.07 4.588 3.79 5.368s5.433-.36 6.06-2.545s-1.07-4.588-3.79-5.367a6.3 6.3 0 0 0-1.763-.246z"/></svg>

Как использовать иконку Hoppscotch

React

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

<Icon icon="devicon:hoppscotch" width="24" />

Vue

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

<template>
  <Icon icon="devicon:hoppscotch" width="24" />
</template>

Svelte

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

<Icon icon="devicon:hoppscotch" width="24" />

Tailwind CSS

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

UnoCSS

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

Веб-компонент

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

<iconify-icon icon="devicon:hoppscotch"></iconify-icon>

Изображение HTML

<img src="https://iconyz.com/api/public/svg/devicon/hoppscotch.svg" alt="Иконка Hoppscotch" width="24" height="24">

Иконка Hoppscotch в других наборах

Вопросы и ответы: Иконка Hoppscotch

Можно ли бесплатно использовать иконку Hoppscotch в коммерческих проектах?

Да. Devicon icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах.

Как использовать иконку Hoppscotch в React?

Установите @iconify/react и выведите <Icon icon="devicon:hoppscotch" /> или нажмите «Копировать код» на этой странице, чтобы получить отдельный React-компонент.

Как добавить иконку Hoppscotch на веб-страницу?

Подключите SVG-файл в теге изображения: <img src="https://iconyz.com/api/public/svg/devicon/hoppscotch.svg" alt="Иконка Hoppscotch">, или вставьте SVG-код прямо в страницу, чтобы стилизовать его через CSS.

Все Иконки Devicon →