Иконка Falling Stars
meteocons:falling-stars
Иконка Falling Stars (meteocons:falling-stars) — бесплатная SVG-иконка из набора Meteocons от Bas Milius. Она нарисована на сетке 512 × 512. Meteocons icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах. Скопируйте её как код SVG, JSX, Vue или Svelte или скачайте SVG-файл.
- Набор
- Meteocons
- Автор
- Bas Milius
- Лицензия
- MIT
- Размер
- 512 × 512
- Теги
- fallingstars, star
Код SVG
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><defs><clipPath id="SVGt2Tt9c7j"><path fill="none" d="M512 27.5L240 189.1l16 48l40 32l216-96V27.5z"/></clipPath><symbol id="SVGG3UcUlWO" viewBox="0 0 279 279"><path fill="none" stroke="#72b9d5" stroke-linecap="round" stroke-linejoin="round" stroke-width="15" d="M256.8 173.1A133.3 133.3 0 0 1 122.4 40.7A130.5 130.5 0 0 1 127 7.5A133 133 0 0 0 7.5 139.1c0 73.1 60 132.4 134.2 132.4c62.5 0 114.8-42.2 129.8-99.2a135.6 135.6 0 0 1-14.8.8Z"><animateTransform additive="sum" attributeName="transform" dur="6s" repeatCount="indefinite" type="rotate" values="-15 135 135; 9 135 135; -15 135 135"/></path></symbol></defs><g clip-path="url(#SVGt2Tt9c7j)" opacity="0"><path fill="none" stroke="#fcd34d" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4" d="m370 174.1l-5.4 2.7"/><path fill="none" stroke="#fcd34d" stroke-dasharray="12.6 12.6" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4" d="M353.4 182.4L269 224.6"/><path fill="none" stroke="#fcd34d" stroke-linecap="round" stroke-miterlimit="10" stroke-width="4" d="m263.4 227.4l-5.4 2.7"/><path fill="#fcd34d" d="m367.1 146.3l18 18.3a1.8 1.8 0 0 1 .5 1.8l-6.5 24.9a1.8 1.8 0 0 0 3 1.7l18.4-18a1.8 1.8 0 0 1 1.7-.4l25 6.4a1.8 1.8 0 0 0 1.7-3l-18-18.4a1.8 1.8 0 0 1-.5-1.7l6.4-24.9a1.8 1.8 0 0 0-3-1.7l-18.3 18a1.8 1.8 0 0 1-1.7.4l-25-6.4a1.8 1.8 0 0 0-1.7 3Z"/><animateTransform id="SVGm4hF6cWt" additive="sum" attributeName="transform" begin="0s; x1.end+2s" dur="1s" repeatCount="indefinite" type="translate" values="-126 48; 42 -30"/><animate id="SVGMSOEXcsB" attributeName="opacity" begin="0s; y1.end+2s" calcMode="spline" dur="1s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1" keyTimes="0; .17; .67; 1" values="0; 1; 1; 0"/></g><path fill="#fcd34d" d="m282.8 162.8l25-6.4a1.8 1.8 0 0 1 1.7.5l18.3 18a1.8 1.8 0 0 0 3-1.7l-6.4-25a1.8 1.8 0 0 1 .5-1.7l18-18.4a1.8 1.8 0 0 0-1.8-3l-24.9 6.5a1.8 1.8 0 0 1-1.7-.5l-18.4-18a1.8 1.8 0 0 0-3 1.7l6.5 25a1.8 1.8 0 0 1-.5 1.7l-18 18.3a1.8 1.8 0 0 0 1.7 3Z"><animateTransform additive="sum" attributeName="transform" calcMode="spline" dur="6s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="rotate" values="-15 312 144; 15 312 144; -15 312 144"/><animate attributeName="opacity" calcMode="spline" dur="6s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" values="1; .75; 1; .75; 1; .75; 1"/></path><path fill="#fcd34d" d="m337.3 223.7l24.8 7a1.8 1.8 0 0 1 1.3 1.2l6.9 24.8a1.8 1.8 0 0 0 3.4 0l7-24.8a1.8 1.8 0 0 1 1.2-1.3l24.8-6.9a1.8 1.8 0 0 0 0-3.4l-24.8-7a1.8 1.8 0 0 1-1.3-1.2l-6.9-24.8a1.8 1.8 0 0 0-3.4 0l-7 24.8a1.8 1.8 0 0 1-1.2 1.3l-24.8 6.9a1.8 1.8 0 0 0 0 3.4Z"><animateTransform additive="sum" attributeName="transform" begin="-.67s" calcMode="spline" dur="6s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" type="rotate" values="-15 372 222; 15 372 222; -15 372 222"/><animate attributeName="opacity" begin="-.67s" calcMode="spline" dur="6s" keySplines=".42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1; .42, 0, .58, 1" repeatCount="indefinite" values="1; .75; 1; .75; 1; .75; 1"/></path><use width="279" height="279" href="#SVGG3UcUlWO" transform="translate(116.5 116.5)"/></svg>Как использовать иконку Falling Stars
React
import { Icon } from "@iconify/react";
<Icon icon="meteocons:falling-stars" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="meteocons:falling-stars" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="meteocons:falling-stars" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[meteocons--falling-stars]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/meteocons -->
<div class="i-meteocons:falling-stars"></div>Веб-компонент
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="meteocons:falling-stars"></iconify-icon>Изображение HTML
<img src="https://iconyz.com/api/public/svg/meteocons/falling-stars.svg" alt="Иконка Falling Stars" width="24" height="24">Похожие иконки в наборе Meteocons
Вопросы и ответы: Иконка Falling Stars
Можно ли бесплатно использовать иконку Falling Stars в коммерческих проектах?
Да. Meteocons icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах.
Как использовать иконку Falling Stars в React?
Установите @iconify/react и выведите <Icon icon="meteocons:falling-stars" /> или нажмите «Копировать код» на этой странице, чтобы получить отдельный React-компонент.
Как добавить иконку Falling Stars на веб-страницу?
Подключите SVG-файл в теге изображения: <img src="https://iconyz.com/api/public/svg/meteocons/falling-stars.svg" alt="Иконка Falling Stars">, или вставьте SVG-код прямо в страницу, чтобы стилизовать его через CSS.