devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt

Бесплатные иконки часов (SVG)

48 бесплатных иконок часов из открытых наборов — нажмите на любую, чтобы изменить размер, цвет и толщину обводки, и скопируйте её как SVG, JSX, data URI или CSS.

Обновлено

clock
Lucideclock
Tablerclock
Heroiconsclock
Phosphorclock
Bootstrap Iconsclock
Iconoirclock-12-filled
Fluent UIlock-clock
Material Symbolsclock
Material Design Iconsclock-1
Lucideclock-filled
Tablerclock-16-solid
Heroiconsclock-bold
Phosphorclock-fill
Bootstrap Iconsclock-solid
Iconoirclock-12-regular
Fluent UIlock-clock-outline
Material Symbolsclock-outline
Material Design Iconsclock-2
Lucideclock-2
Tablerclock-20-solid
Heroiconsclock-duotone
Phosphorclock-16-filled
Fluent UIlock-clock-outline-rounded
Material Symbolsclock-in
Material Design Iconsclock-3
Lucideclock-x
Tablerclock-solid
Heroiconsclock-fill
Phosphorclock-16-regular
Fluent UIlock-clock-outline-sharp
Material Symbolsbed-clock
Material Design Iconsclock-4
Lucideclock-12
Tablerclock-light
Phosphorclock-20-filled
Fluent UIlock-clock-rounded
Material Symbolsbus-clock
Material Design Iconsclock-5
Lucideclock-24
Tablerclock-thin
Phosphorclock-20-regular
Fluent UIlock-clock-sharp
Material Symbolscar-clock
Material Design Iconsclock-6
Lucideclock-up
Tablerclock-24-filled
Fluent UIsave-clock
Material Symbols

Использование иконок часов

Иконки часов показывают время, длительность, историю и списки «недавно просмотренных».

Все иконки здесь следуют currentColor, поэтому они берут цвет текста того элемента, в котором находятся: одна SVG работает и на светлом, и на тёмном фоне, в ссылках и в кнопках. Задайте явные width и height (или размер в CSS через 1em), чтобы верстка не смещалась во время загрузки страницы.

Доступность иконок

Если иконка декоративная или стоит рядом с видимым текстом, добавьте aria-hidden="true". Если она — единственное содержимое кнопки или ссылки, задайте этому элементу aria-label, например «Часы».

Лицензии

Эти иконки часов взяты из Lucide, Tabler, Heroicons, Phosphor, Bootstrap Icons, Iconoir, Fluent UI, Material Symbols и Material Design Icons. Это открытые наборы под лицензиями MIT, ISC или Apache 2.0, которые разрешают личное и коммерческое использование. Нужно что-то другое? Ищите среди более 70 000 иконок в SVG Icon Finder.

Часто задаваемые вопросы

Эти иконки часов бесплатны для коммерческого использования?
Да. Они взяты из открытых наборов иконок под лицензиями MIT, ISC или Apache 2.0, которые разрешают коммерческое использование. Сохраняйте уведомление о лицензии, если перераспространяете сами файлы иконок.
Как изменить цвет иконки часов?
В SVG используется currentColor, поэтому задайте CSS-свойство color у родительского элемента или откройте иконку в поисковике и выберите фиксированный цвет перед копированием.
Можно ли использовать эти иконки в Webflow или React?
Да. Откройте иконку и используйте Copy to Webflow (вставит Code Embed) или Copy JSX для React-компонента.