Pixmora

Иконка карандаша для правки записи

Карандаш Lucide открывает редактирование существующего объекта. Плюс рядом означает создание, корзина - удаление: не смешивайте эти три действия в одном знаке.

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

Сценарий страницы: Изменение записи. Основной вариант - lucide:pencil, набор Lucide, автор Lucide Contributors, лицензия ISC.

Карандаш (pencil): Наклонённый карандаш без дополнительной линии листа. Редактировать профиль, товар, комментарий.

Карандаш и строка (pencil-line): Карандаш и горизонталь: акцент на правке текста. Редактирование подписи, названия, однострочного поля.

Перо в квадрате (square-pen): Рамка листа и перо: правка в карточке или модалке. Кнопка «изменить» в плитке, где соседи тоже в квадратах.

В строке таблицы 16–18 px. На карточке профиля 20–24. В самом поле ввода карандаш как декорация обычно лишний.

Это пример разметки без обработчиков. Открытие формы правки подключите в коде. Заголовок TEST демонстрационный. Путь к SVG замените. Без текста на кнопке нужен aria-label.

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

Файлы SVG

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

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

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

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

<article aria-labelledby="item-title">
  <h2 id="item-title">Черновик TEST</h2>
  <button type="button" aria-label="Редактировать запись">
    <img src="lucide-pencil.svg" width="18" height="18" alt="">
  </button>
</article>

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

pencil или file-pen?

pencil - действие над записью в интерфейсе. file-pen сильнее про файл-документ. Для строки таблицы обычно достаточно pencil.

Нужно ли подтверждение перед входом в правку?

Обычно нет. Подтверждение важнее перед удалением или необратимой публикацией.