Pixmora

Иконка геолокации для адреса на карте

Метка места, а не стрелка маршрута. Три варианта Lucide для адреса офиса, подтверждённой точки и домашнего адреса.

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

Сценарий страницы: Адрес офиса и метка на карте. Основной вариант - lucide:map-pin, набор Lucide, автор Lucide Contributors, лицензия ISC.

Метка адреса (map-pin): Стандартная точка на карте. Адрес офиса, пункт выдачи, блок «Как нас найти».

Подтверждённая точка (map-pin-check): Метка с галочкой: адрес проверен или выбран. Выбранный пункт самовывоза или подтверждённая геометка.

Домашний адрес (map-pin-house): Внутри метки дом: акцент на жилом или основном адресе. Адрес доставки домой или профиль «мой адрес».

В строке контактов 16–24 px. На карте-превью в карточке магазина чаще 32. Крупный PNG нужен, если метку вставляют как отдельную картинку в макет.

Это пример разметки без обработчиков. Замените URL и путь к SVG. Подпись объясняет, куда ведёт ссылка. Не подписывайте декоративную метку словом «геолокация», если пользователь ожидает адрес.

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

Файлы SVG

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

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

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

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

<a href="https://example.com/contacts#office">
  <img src="lucide-map-pin.svg" width="24" height="24" alt="">
  Офис на карте
</a>

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

Почему не navigation или compass?

Стрелка навигации обещает маршрут «отсюда». Map pin показывает место. Для адреса офиса нужна метка, а не компас.

Нужны ли светлая и тёмная версии файла?

Отдельных брендовых светлых и тёмных файлов в этой подборке нет. Для img скачайте SVG нужного цвета; для inline удалите или переопределите root color и задайте CSS color.