DESIGN

Генератор фавіконок з тексту або символу

Що таке фавіконка і навіщо вона?

Фавіконка (favicon) — маленька іконка розміром 16×16, 32×32 або 48×48 пікселів, що відображається у вкладці браузера, закладках та ярликах на робочому столі. Незважаючи на малий розмір, вона важлива для впізнаваності бренду та profesійного вигляду сайту. Відсутня фавіконка — ознака незавершеності проекту.

Сучасні вимоги до фавіконок

Мінімальний набір: favicon.ico (16×16 та 32×32) для старих браузерів. apple-touch-icon.png (180×180) для iOS. favicon-192.png та favicon-512.png для Android PWA. SVG-фавіконка (<link rel="icon" type="image/svg+xml">) — ідеальна для браузерів, що підтримують масштабування.

Як створити гарну фавіконку

Обирайте прості форми, що добре виглядають на 16×16. Монограма (перша літера бренду) — класичне рішення. Емодзі як фавіконки набирають популярність через простоту і впізнаваність. Переконайтеся, що фавіконка виглядає добре як на білому, так і на темному фоні браузера (темна тема).

Впровадження фавіконки

Розмістіть favicon.ico у корені сайту — браузери шукають його там автоматично. Для SVG та PNG додайте теги <link> у <head>. Для PWA використовуйте Web App Manifest з іконками різних розмірів. Після зміни фавіконки може знадобитися очищення кешу браузера.