ICONYZ
العربية
أيقونة React Dark من theSVG Color

أيقونة React Dark

thesvg-color:react-dark

أيقونة React Dark (thesvg-color:react-dark) أيقونة SVG مجانية من مجموعة theSVG Color من تصميم thesvg.org. مرسومة على شبكة 569 × 512. تُنشر theSVG Color icons بموجب ترخيص MIT، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية. انسخها كشيفرة SVG أو JSX أو Vue أو Svelte، أو نزّل ملف SVG.

المجموعة
theSVG Color
المؤلف
thesvg.org
الترخيص
MIT
الحجم
569 × 512
الوسوم
reactdark
تنزيل SVG

شيفرة SVG

<svg xmlns="http://www.w3.org/2000/svg" width="569" height="512" viewBox="0 0 569 512"><g fill="#58c4dc"><path d="M285.5 201c-30.1 0-54.5 24.4-54.5 54.5s24.4 54.5 54.5 54.5s54.5-24.4 54.5-54.5s-24.4-54.5-54.5-54.5"/><path d="M568.96 255.994c0-42.786-39.622-80.313-102.708-105.009c.843-5.561 1.605-11.063 2.147-16.464c6.223-61.48-8.59-105.852-41.69-124.967c-37.032-21.383-89.34-5.863-142.23 36.462C231.59 3.691 179.284-11.829 142.25 9.554c-33.099 19.115-47.912 63.488-41.69 124.967c.542 5.401 1.285 10.923 2.148 16.504a289 289 0 0 0-15.375 6.365C31.011 182.71 0 217.765 0 255.994c0 42.787 39.622 80.313 102.708 105.01c-.863 5.561-1.606 11.063-2.147 16.464c-6.223 61.48 8.59 105.852 41.689 124.967a73.5 73.5 0 0 0 37.354 9.557c31.352 0 67.964-16.504 104.876-46.02c36.892 29.516 73.524 46.02 104.916 46.02a73.57 73.57 0 0 0 37.354-9.557c33.099-19.115 47.912-63.488 41.69-124.967c-.542-5.401-1.305-10.903-2.148-16.464C529.378 336.347 569 298.76 569 255.994M389.155 27.103a47.44 47.44 0 0 1 24.087 5.903c22.982 13.271 33.299 49.272 28.281 98.764a267 267 0 0 1-1.224 10.22a479 479 0 0 0-80.288-16.845a480.3 480.3 0 0 0-54.797-61.179c31.373-24.254 60.818-36.863 83.921-36.863m-10.779 283.103a591 591 0 0 1-33.118 51.2a590 590 0 0 1-60.778 3.091a590 590 0 0 1-60.758-3.092a590 590 0 0 1-33.018-51.2a583 583 0 0 1-27.64-54.21a583 583 0 0 1 27.64-54.212a597 597 0 0 1 32.918-51.019a579 579 0 0 1 60.878-3.172a592 592 0 0 1 60.758 3.092a599 599 0 0 1 33.038 51.1a588 588 0 0 1 27.64 54.21a588 588 0 0 1-27.64 54.212m41.449-20.079a425.5 425.5 0 0 1 15.656 53.208a421 421 0 0 1-53.713 12.95a603 603 0 0 0 20.072-32.507c6.403-11.123 12.405-22.347 18.065-33.57m-173.442 100.17c12.485.763 25.23 1.205 38.137 1.205s25.732-.442 38.237-1.205a424 424 0 0 1-38.237 40.156a422 422 0 0 1-38.137-40.156m-59.051-34.133a421 421 0 0 1-53.733-12.91a425.5 425.5 0 0 1 15.596-53.127c5.58 11.223 11.561 22.447 18.065 33.57c6.503 11.124 13.227 22.087 20.072 32.507m-38.137-134.524a426 426 0 0 1-15.556-52.926a426 426 0 0 1 53.592-12.99c-6.864 10.38-13.589 21.142-20.072 32.365s-12.404 22.307-18.065 33.551m173.543-100.17c-12.485-.763-25.23-1.205-38.237-1.205q-19.35 0-38.137 1.205a422 422 0 0 1 38.137-40.157a422 422 0 0 1 38.237 40.157m79.083 66.62a591 591 0 0 0-20.172-32.527a421 421 0 0 1 53.853 12.97a429 429 0 0 1-15.596 53.127c-5.58-11.224-11.581-22.447-18.065-33.55m-274.203-56.44c-5.078-49.473 5.3-85.494 28.262-98.765a47.6 47.6 0 0 1 24.086-5.903c23.103 0 52.548 12.609 83.92 36.863a481 481 0 0 0-54.836 61.219a486 486 0 0 0-80.288 16.785c-.461-3.433-.883-6.826-1.204-10.2m-29.004 50.316a747 747 0 0 1 9.454-4.015a484.4 484.4 0 0 0 25.592 77.903a483.4 483.4 0 0 0-25.612 78.065c-51.144-20.982-80.79-50.055-80.79-78.065c0-26.543 26.094-53.468 71.356-73.888m57.326 296.857c-22.963-13.272-33.34-49.292-28.262-98.765c.321-3.373.743-6.766 1.204-10.22a479 479 0 0 0 80.288 16.846a482 482 0 0 0 54.797 61.219c-43.737 33.791-83.7 44.935-107.967 30.92m285.664-98.765c5.018 49.493-5.3 85.493-28.282 98.765c-24.246 14.055-64.23 2.871-107.947-30.92a482 482 0 0 0 54.777-61.219a479 479 0 0 0 80.288-16.846c.481 3.454.883 6.847 1.224 10.22m19.63-46.18a485.3 485.3 0 0 0-25.631-78.024a485.3 485.3 0 0 0 25.611-78.064c51.043 20.982 80.77 50.055 80.77 78.064c0 28.01-29.646 57.083-80.79 78.065"/></g></svg>

كيفية استخدام أيقونة React Dark

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

مكوّن ويب

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

<iconify-icon icon="thesvg-color:react-dark"></iconify-icon>

صورة HTML

<img src="https://iconyz.com/api/public/svg/thesvg-color/react-dark.svg" alt="أيقونة React Dark" width="24" height="24">

أيقونات ذات صلة في theSVG Color

أيقونة React Dark في مجموعات أخرى

الأسئلة الشائعة حول أيقونة React Dark

هل أيقونة React Dark مجانية للاستخدام التجاري؟

نعم. تُنشر theSVG Color icons بموجب ترخيص MIT، الذي يسمح باستخدامها في المشاريع الشخصية والتجارية.

كيف أستخدم أيقونة React Dark في React؟

ثبّت @iconify/react واعرض <Icon icon="thesvg-color:react-dark" />، أو استخدم «نسخ الشيفرة» في هذه الصفحة للحصول على مكوّن React مستقل.

كيف أضيف أيقونة React Dark إلى صفحة ويب؟

اربط ملف SVG في وسم صورة: <img src="https://iconyz.com/api/public/svg/thesvg-color/react-dark.svg" alt="أيقونة React Dark">، أو الصق شيفرة SVG مباشرة في الصفحة لتنسيقها باستخدام CSS.

تصفح كل أيقونات theSVG Color →