Иконка Puzzle

foundation:puzzle

Иконка Puzzle (foundation:puzzle) — бесплатная SVG-иконка из набора Foundation от Zurb. Она нарисована на сетке 100 × 100. Foundation icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах. Скопируйте её как код SVG, JSX, Vue или Svelte или скачайте SVG-файл.

Набор: Foundation
Автор: Zurb
Лицензия: MIT
Размер: 100 × 100

Скачать SVG

Код SVG

<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="currentColor" d="M78.589 48.774V35.887h-.001a3.967 3.967 0 0 0-3.87-3.953v-.038H62.666c-.059.002-.115.018-.175.018s-.116-.016-.175-.018h-.203v-.021c-2.8-.198-5.016-2.508-5.016-5.356c0-1.236.432-2.361 1.131-3.271h-.106a8.17 8.17 0 0 0 1.098-4.092a8.22 8.22 0 0 0-8.223-8.221a8.22 8.22 0 0 0-8.221 8.221c0 1.491.403 2.886 1.098 4.092h-.091a5.35 5.35 0 0 1 1.117 3.256c0 2.847-2.216 5.157-5.017 5.354v.038H25.361v.02a3.97 3.97 0 0 0-3.955 3.971c0 .058.015.112.017.17v13.421h.043a2.245 2.245 0 0 0 2.243 2.244c.226 0 .44-.045.645-.109a9.7 9.7 0 0 1 3.883-.808c5.393 0 9.764 4.371 9.764 9.762c0 5.392-4.371 9.762-9.764 9.762a9.7 9.7 0 0 1-3.788-.763a2.2 2.2 0 0 0-.769-.144a2.24 2.24 0 0 0-2.242 2.244c0 .127.017.25.038.372h-.053v12.884c-.003.058-.017.112-.017.17a3.975 3.975 0 0 0 3.973 3.973c.109 0 .212-.023.319-.032H38.89a2.245 2.245 0 0 0 2.244-2.246c0-.248-.05-.481-.124-.704l-.004-.014c-.017-.051-.027-.106-.048-.155h.008a9.8 9.8 0 0 1-.397-2.741a9.76 9.76 0 0 1 9.762-9.762a9.76 9.76 0 0 1 9.762 9.762a9.8 9.8 0 0 1-.397 2.741h.025a2.245 2.245 0 0 0 2.066 3.123l.038-.004h12.792a3.974 3.974 0 0 0 3.969-3.933h.005V72.038h-.046a2.234 2.234 0 0 0-2.216-1.964v-.099a9.8 9.8 0 0 1-2.567.353c-5.392 0-9.763-4.37-9.763-9.762c0-5.391 4.371-9.762 9.763-9.762c.89 0 1.748.129 2.567.353v-.094l.025.002c1.01 0 1.853-.67 2.134-1.588h.103v-.605c0-.017.005-.032.005-.049z"/></svg>

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

React

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

<Icon icon="foundation:puzzle" width="24" />

Vue

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

<template>
  <Icon icon="foundation:puzzle" width="24" />
</template>

Svelte

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

<Icon icon="foundation:puzzle" width="24" />

Tailwind CSS

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

UnoCSS

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

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

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

<iconify-icon icon="foundation:puzzle"></iconify-icon>

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

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

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

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

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

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

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

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

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

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

Все Иконки Foundation →