Pixmora

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

Стрелка вправо Lucide отмечает следующий шаг последовательности. Ниже отличие от шеврона и от стрелки «к вертикальной линии».

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

Сценарий страницы: Продолжение последовательности. Основной вариант - lucide:arrow-right, набор Lucide, автор Lucide Contributors, лицензия ISC.

Стрелка вправо (arrow-right): Полная стрелка с хвостом вправо. «Далее», переход к следующему шагу или карточке.

Шеврон вправо (chevron-right): Короткий угол без хвоста. Пункт списка «открыть детали» или пагинация вперёд.

К линии вправо (arrow-right-to-line): Стрелка упирается в вертикальную черту справа. Перенос к правому краю, «к концу» ряда или панели.

В кнопке CTA 16–20 px рядом с подписью. В одиночной круглой кнопке карусели 24. Не подменяйте этой стрелкой знак внешней ссылки.

Это пример разметки без обработчиков. Логику перехода на следующий шаг подключите в проекте. Путь к SVG замените. Текст «Далее» уже задаёт имя; img декоративный.

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

Файлы SVG

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

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

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

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

<button type="button">
  Далее
  <img src="lucide-arrow-right.svg" width="20" height="20" alt="">
</button>

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

Чем arrow-right отличается от external-link?

arrow-right остаётся внутри продукта. external-link рисует квадрат и уход «наружу» на другой ресурс.

Ставить стрелку слева или справа от текста «Далее»?

Справа от текста привычнее для направления вперёд. Главное не дублировать смысл двумя разными стрелками.