أيقونة Hoppscotch
thesvg-color:hoppscotch
أيقونة Hoppscotch (thesvg-color:hoppscotch) أيقونة SVG مجانية من مجموعة theSVG Color من تصميم thesvg.org. مرسومة على شبكة 748 × 500. تُنشر theSVG Color icons بموجب ترخيص MIT، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية. انسخها كشيفرة SVG أو JSX أو Vue أو Svelte، أو نزّل ملف SVG.
- المجموعة
- theSVG Color
- المؤلف
- thesvg.org
- الترخيص
- MIT
- الحجم
- 748 × 500
شيفرة 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>كيفية استخدام أيقونة 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>مكوّن ويب
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:hoppscotch"></iconify-icon>صورة HTML
<img src="https://iconyz.com/api/public/svg/thesvg-color/hoppscotch.svg" alt="أيقونة Hoppscotch" width="24" height="24">أيقونة Hoppscotch في مجموعات أخرى
الأسئلة الشائعة حول أيقونة Hoppscotch
هل أيقونة Hoppscotch مجانية للاستخدام التجاري؟
نعم. تُنشر theSVG Color icons بموجب ترخيص MIT، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية.
كيف أستخدم أيقونة Hoppscotch في React؟
ثبّت @iconify/react واعرض <Icon icon="thesvg-color:hoppscotch" />، أو استخدم «نسخ الشيفرة» في هذه الصفحة للحصول على مكوّن React مستقل.
كيف أضيف أيقونة Hoppscotch إلى صفحة ويب؟
اربط ملف SVG في وسم صورة: <img src="https://iconyz.com/api/public/svg/thesvg-color/hoppscotch.svg" alt="أيقونة Hoppscotch">، أو الصق شيفرة SVG مباشرة في الصفحة لتنسيقها باستخدام CSS.