Руководство о скачивании иконок для TechSpecGrid
Как скачать иконки с Lucide.dev
Шаг 1 — Открыть каталог иконок
Перейдите на https://lucide.dev/icons/
Перед вами откроется сетка всех доступных иконок.
Используйте строку поиска вверху для быстрого поиска нужной иконки — например, arrow, user, settings (поиск осуществляется на английском).
Шаг 2 — Выбрать иконку и скачать PNG
Наведите курсор на нужную иконку — она подсветится рамкой.
Кликните по иконке — внизу экрана появится панель с деталями.
Справа в панели находятся кнопки экспорта:
- Copy SVG — скопировать SVG-код в буфер обмена
- Copy Data URL — скопировать иконку как Data URL (base64)
- Download SVG — скачать файл .svg
- Download PNGDownload PNG — скачать файл .png (выделено красным)
Нажмите Download PNGDownload PNG — файл сохранится на ваш компьютер с текущими настройками размера и цвета.
⚠️ Размер и цвет PNG зависят от параметров в левой панели — настройте их
до
скачивания. Ниже описаны параметры в левой панели.
Шаг 3 — Настроить иконку через левое меню (Customizer)
В левой панели находится блок Customizer с четырьмя параметрами:
🎨 Color (Цвет)
- Кликните на цветной квадрат или введите HEX-код в поле рядом (по умолчанию #ffffff — белый).
- Выберите любой цвет — иконка в каталоге и превью обновятся сразу.
✏️ Stroke width (Толщина линии)
- Ползунок регулирует толщину штриха иконки.
- По умолчанию: 2px.
- Диапазон: от тонких (0.5px) до жирных (3–4px) линий.
- Влияет на SVG и PNG при скачивании.
📐 Size (Размер)
- Ползунок задаёт размер иконки в пикселях.
- По умолчанию: 24px.
- Для веб-интерфейса обычно используют 16–32px.