Pixmora

Иконка будильника для напоминания

Будильник Lucide с ножками и «ушками» сигнала. Отличается от обычных часов: обещает напоминание, а не просто время работы.

Как применить иконку «Будильник»

Сценарий страницы: Включение напоминания о событии. Основной вариант - lucide:alarm-clock, набор Lucide, автор Lucide Contributors, лицензия ISC.

Будильник (alarm-clock): Циферблат с ушками и ножками сигнала. Напоминание, будильник, алерт по времени.

Напоминание задано (alarm-clock-check): Будильник с галочкой: слот подтверждён. Напоминание уже создано или время подтверждено.

Выключен (alarm-clock-off): Будильник перечёркнут: сигнал отключён. Состояние «без напоминания» или mute по времени.

В списке событий 20–24 px. В настройках уведомлений 16–20. Для выключенного состояния лучше alarm-clock-off, а не только серый цвет.

Это пример разметки без обработчиков. В своём коде обновляйте aria-pressed и подпись («Включить» / «Выключить напоминание»). Путь к SVG замените. Само напоминание на устройстве эта разметка не ставит.

Лицензия ISC: https://github.com/lucide-icons/lucide/blob/main/LICENSE. Полный текст лицензии добавляется в metadata скачиваемого SVG.

Файлы SVG

Стандартные SVG с полным текстом лицензии ISC в metadata. Отдельных страниц под размер и цвет нет. PNG с выбранным размером и цветом готовится в браузере и требует JavaScript.

Полный текст лицензии ISC

Пример разметки

Доступная подпись: Включить напоминание. Имя файла в примере совпадает с основным вариантом; при смене варианта замените путь на скачанный файл.

<button type="button" aria-pressed="false" aria-label="Включить напоминание">
  <img src="lucide-alarm-clock.svg" width="24" height="24" alt="">
</button>

Частые вопросы

Чем alarm-clock отличается от bell?

bell - общее уведомление. alarm-clock явно про время и напоминание по часам.

Подойдёт ли для таймера Pomodoro?

Для отсчёта интервала понятнее timer. Будильник уместен, если акцент на «разбудить в момент», а не на секундомере.