Pixmora

Иконка стрелки влево для возврата

Стрелка влево Lucide ведёт на предыдущий экран или шаг мастера. Отличается от лёгкого шеврона и от стрелки «от вертикальной линии».

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

Сценарий страницы: Возврат к предыдущему шагу. Основной вариант - lucide:arrow-left, набор Lucide, автор Lucide Contributors, лицензия ISC.

Стрелка влево (arrow-left): Полная стрелка с хвостом влево. Кнопка «Назад» между экранами или шагами формы.

Шеврон влево (chevron-left): Только угол без длинного хвоста: легче визуально. Карусель, пагинация, компактный возврат в мобильной шапке.

От линии влево (arrow-left-from-line): Стрелка уходит влево от вертикальной черты. «Выйти из панели» или вернуться от зафиксированного края макета.

В шапке мастера 20–24 px. В хлебных крошках 16. Не делайте стрелку больше текста «Назад»: она должна быть маркером, а не героем блока.

Это пример разметки без обработчиков. Замените href на реальный предыдущий URL или оставьте якорь на существующий id в странице. Путь к SVG замените на свой файл.

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

Файлы SVG

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

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

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

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

<a href="#step-1">
  <img src="lucide-arrow-left.svg" width="20" height="20" alt="">
  Назад к шагу 1
</a>
<section id="step-1"></section>

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

Когда брать chevron-left вместо arrow-left?

Шеврон для листания внутри одного контекста. Полная стрелка сильнее обещает смену экрана или шага.

Достаточно ли одной иконки без слова «Назад»?

На мобильном часто да, если aria-label ясен. На десктопе текст снижает ошибку «куда вернёт».