Иконка Time Progress Fill

lets-icons:time-progress-fill

Иконка Time Progress Fill (lets-icons:time-progress-fill) — бесплатная SVG-иконка из набора Lets Icons от Leonid Tsvetkov. Она нарисована на сетке 24 × 24. Lets Icons выпущены под лицензией CC BY 4.0, которая разрешает использование в личных и коммерческих проектах при условии указания автора. Скопируйте её как код SVG, JSX, Vue или Svelte или скачайте SVG-файл.

Набор: Lets Icons
Автор: Leonid Tsvetkov
Лицензия: CC-BY-4.0
Размер: 24 × 24
Категория: Время
Теги: timeprogress, progressfill, timeprogressfill

Скачать SVG

Код SVG

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><mask id="SVG3gQWfb5W" width="22" height="22" x="1" y="1" fill="#000" maskUnits="userSpaceOnUse"><path fill="#fff" d="M1 1h22v22H1z"/><path d="M12 2a10 10 0 1 1-7.071 2.929l2.828 2.828A6 6 0 1 0 12 6z"/></mask><g fill="none"><path fill="currentColor" d="M12 2a10 10 0 1 1-7.071 2.929l2.828 2.828A6 6 0 1 0 12 6z"/><path fill="currentColor" d="M12 2V1h-1v1zm6.344 2.27l.634-.773zm2.475 12.444l.882.471zm-4.992 4.525l.382.924zm-6.73.33l-.29.957zm-5.412-4.013l-.831.555zM2.048 11.02l-.995-.098zM4.93 4.929l.707-.707l-.707-.707l-.707.707zm2.828 2.828l.707.707l.708-.707l-.708-.707zM6.03 11.412l-.995-.098zm.982 3.921l-.831.556zm3.247 2.409l-.29.957zm4.038-.199l-.383-.924zm2.996-2.715l-.882-.471zm.593-3.998l-.981.194zm-2.079-3.468l.635-.773zM12 6h-1v1h1zm0-3a9 9 0 0 1 5.71 2.043l1.268-1.546A11 11 0 0 0 12 1zm5.71 2.043a9 9 0 0 1 3.117 5.201l1.962-.39a11 11 0 0 0-3.81-6.357zm3.117 5.201a9 9 0 0 1-.89 5.999l1.764.942a11 11 0 0 0 1.088-7.331zm-.89 5.999a9 9 0 0 1-4.493 4.072l.765 1.848a11 11 0 0 0 5.492-4.978zm-4.493 4.072a9 9 0 0 1-6.057.297l-.58 1.914a11 11 0 0 0 7.402-.363zm-6.057.297A9 9 0 0 1 4.517 17l-1.663 1.111a11 11 0 0 0 5.953 4.415zM4.517 17a9 9 0 0 1-1.474-5.882l-1.99-.196a11 11 0 0 0 1.8 7.19zm-1.474-5.882a9 9 0 0 1 2.593-5.482L4.222 4.222a11 11 0 0 0-3.169 6.7zm1.179-5.482L7.05 8.464L8.464 7.05L5.636 4.222zM7.05 7.05a7 7 0 0 0-2.016 4.264l1.99.196a5 5 0 0 1 1.44-3.046zm-2.016 4.264a7 7 0 0 0 1.146 4.575l1.663-1.111a5 5 0 0 1-.819-3.268zm1.146 4.575a7 7 0 0 0 3.788 2.81l.58-1.914a5 5 0 0 1-2.705-2.007zm3.788 2.81a7 7 0 0 0 4.71-.232l-.765-1.848a5 5 0 0 1-3.364.166zm4.71-.232a7 7 0 0 0 3.496-3.167l-1.764-.943a5 5 0 0 1-2.497 2.262zm3.496-3.167a7 7 0 0 0 .692-4.666l-1.962.39a5 5 0 0 1-.494 3.333zm.692-4.666A7 7 0 0 0 16.44 6.59l-1.269 1.546a5 5 0 0 1 1.732 2.89zM16.44 6.59A7 7 0 0 0 12 5v2a5 5 0 0 1 3.172 1.135zM13 6V2h-2v4z" mask="url(#SVG3gQWfb5W)"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M12 12L5 5"/></g></svg>

Как использовать иконку Time Progress Fill

React

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

<Icon icon="lets-icons:time-progress-fill" width="24" />

Vue

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

<template>
  <Icon icon="lets-icons:time-progress-fill" width="24" />
</template>

Svelte

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

<Icon icon="lets-icons:time-progress-fill" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[lets-icons--time-progress-fill]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/lets-icons -->
<div class="i-lets-icons:time-progress-fill"></div>

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

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

<iconify-icon icon="lets-icons:time-progress-fill"></iconify-icon>

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

<img src="https://iconyz.com/api/public/svg/lets-icons/time-progress-fill.svg" alt="Иконка Time Progress Fill" width="24" height="24">

Вопросы и ответы: Иконка Time Progress Fill

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

Да. Lets Icons выпущены под лицензией CC BY 4.0, которая разрешает использование в личных и коммерческих проектах при условии указания автора.

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

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

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

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

Все Lets Icons →