Favicon.kz
Обложка статьи

Фавикон из текста: буква или инициалы в SVG

Самый быстрый вариант для личных сайтов, портфолио и стартапов — favicon из одной буквы (например, первой буквы бренда) или инициалов. Главное — правильно подготовить SVG, чтобы текст не «слетел».

Правило №1: переведите текст в кривые

Если оставить текст как текст, на другом компьютере/сервере может не быть нужного шрифта — и буква отобразится не так. Решение: Convert to Outlines / Create Outlines.

Как сделать в Figma

Советы, чтобы выглядело лучше в 16×16

  • Используйте простые формы: 1 буква лучше 2–3 символов
  • Сделайте букву толще, чем в логотипе (мелкие детали пропадают)
  • Оставьте поля вокруг буквы (не прижимайте к краям)
  • Проверьте на тёмной и светлой теме

Дальше — генерация набора

Загрузите получившийся SVG в генератор и скачайте ZIP с SVG/PNG/ICO + готовым HTML-сниппетом.