ICONYZ
Русский
Иконка Beach 24 из набора Fluent UI System Color Icons

Иконка Beach 24

fluent-color:beach-24

Иконка Beach 24 (fluent-color:beach-24) — бесплатная SVG-иконка из набора Fluent UI System Color Icons от Microsoft Corporation. Она нарисована на сетке 24 × 24. Fluent UI System Color Icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах. Скопируйте её как код SVG, JSX, Vue или Svelte или скачайте SVG-файл.

Набор
Fluent UI System Color Icons
Автор
Microsoft Corporation
Лицензия
MIT
Размер
24 × 24
Скачать SVG

Код SVG

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none"><path fill="url(#SVG9SvpXdZg)" d="m16.552 7.8l-1.302-.739l-4.316 7.607l1.302.739z"/><path fill="url(#SVGXfxc7cux)" d="m6.347 19.448l2.462 1.613l3.052-1.457l3.053 1.38l2.72-1.458l1.366.779c-.037-2.17-1.305-4.273-3.545-5.419c-3.36-1.724-7.643-.656-9.551 2.381a5.73 5.73 0 0 0-.899 3.327l1.342-1.157z"/><path fill="url(#SVG1VsScbcF)" d="M17.915 18.061a.88.88 0 0 0-.835.607c-.723 2.204-3.54 2.172-4.259.109a.88.88 0 0 0-.833-.591a.87.87 0 0 0-.822.59v.002c-.706 2.062-3.524 2.107-4.259-.085a.87.87 0 0 0-.865-.595c-.403.003-.721.308-.82.655l-.003.01c-.198.815-.56 1.227-.956 1.463h-.001c-.418.254-.989.363-1.642.376a.874.874 0 0 0-.87.872c0 .474.398.873.873.873c.822 0 1.744-.14 2.544-.621a3.5 3.5 0 0 0 1.001-.902c1.575 1.685 4.305 1.67 5.833-.052c1.558 1.75 4.368 1.712 5.914-.079a4.6 4.6 0 0 0 3.462 1.604c.49 0 .873-.402.873-.873a.883.883 0 0 0-.873-.872c-1.132 0-2.251-.735-2.626-1.883v-.001a.88.88 0 0 0-.836-.607"/><path fill="url(#SVGJ4oETdai)" d="M19.647 12.813a1 1 0 0 0 1.361-.373l.072-.125c1.886-3.323.791-7.503-2.545-9.402c-3.336-1.9-7.582-.739-9.468 2.584l-.192.336a.75.75 0 0 0 .28 1.025z"/><path fill="url(#SVGJdLFlrek)" d="M18.618 2.97c-1.551.506-4.55 2.622-6.218 5.734l4.5 2.55c1.81-3.032 2.083-6.693 1.718-8.284"/><defs><linearGradient id="SVG9SvpXdZg" x1="12.073" x2="17.739" y1="13.327" y2="7.042" gradientUnits="userSpaceOnUse"><stop stop-color="#cd3e1d"/><stop offset="1" stop-color="#592a00"/></linearGradient><linearGradient id="SVGXfxc7cux" x1="12" x2="12" y1="19.695" y2="14.062" gradientUnits="userSpaceOnUse"><stop stop-color="#ffc7a3"/><stop offset="1" stop-color="#ffa43d"/></linearGradient><linearGradient id="SVG1VsScbcF" x1="12.013" x2="12.013" y1="21.467" y2="18.318" gradientUnits="userSpaceOnUse"><stop offset=".061" stop-color="#0fafff"/><stop offset="1" stop-color="#0078d4"/></linearGradient><linearGradient id="SVGJ4oETdai" x1="20.619" x2="10.728" y1="15.15" y2="1.963" gradientUnits="userSpaceOnUse"><stop stop-color="#aa1d2d"/><stop offset="1" stop-color="#fb6f7b"/></linearGradient><linearGradient id="SVGJdLFlrek" x1="18.483" x2="12.915" y1="8.005" y2="6.15" gradientUnits="userSpaceOnUse"><stop stop-color="#fecbe6"/><stop offset="1" stop-color="#fdafd9"/></linearGradient></defs></g></svg>

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

React

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

<Icon icon="fluent-color:beach-24" width="24" />

Vue

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

<template>
  <Icon icon="fluent-color:beach-24" width="24" />
</template>

Svelte

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

<Icon icon="fluent-color:beach-24" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-color--beach-24]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-color -->
<div class="i-fluent-color:beach-24"></div>

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

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

<iconify-icon icon="fluent-color:beach-24"></iconify-icon>

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

<img src="https://iconyz.com/api/public/svg/fluent-color/beach-24.svg" alt="Иконка Beach 24" width="24" height="24">

Похожие иконки в наборе Fluent UI System Color Icons

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

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

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

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

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

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

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

Все Fluent UI System Color Icons →