Генератор на фавикони

Превърнете един PNG, JPG или SVG файл във favicon.ico и всеки необходим размер на икона за Вашия сайт, събрани в ZIP архив.

Неквадратно изображение

Цялото изображение остава видимо, центрирано с отстъпи около него.

Фон

Прозрачният фон е подходящ за раздели на браузъра; за икони на началния екран на iPhone фоновият цвят е по-сигурен избор.

Вашият пакет с икони

Вашата фавикона (favicon) и пакетът с икони ще се появят тук.

Готово. Добавете PNG, JPG или SVG, за да започнете.

Вашето изображение се превръща в икони директно във Вашия браузър. Нищо не се качва в BroBroGo.

ЧЗВ

Кои файлове са включени в пакета с икони?

favicon.ico с версии от 16, 32 и 48 пиксела вътре, PNG икони с размери 16, 32, 180, 192 и 512 пиксела, както и файл site.webmanifest, който описва големите икони. Ако започнете от SVG, самият векторен файл също се включва. Един ZIP архив съдържа всичко.

Какъв размер трябва да бъде изходното изображение?

Файл в SVG формат е идеален — всяка икона се изчертава от вектора, така че дори при 16 пиксела остава ясна. За PNG или JPG започнете с размер поне 512 × 512; по-малките изображения се увеличават и могат да изглеждат размазани.

Трябва ли фонът да бъде прозрачен или цветен?

Иконите за раздели изглеждат добре с прозрачен фон. Началните екрани на iPhone и iPad обаче запълват прозрачните зони с черно — ако има вероятност потребителите да добавят сайта Ви към началния си екран, изберете фонов цвят.

Какво се случва с изображение, което не е квадратно?

Иконите са квадратни, но Вашето изображение никога не се разтяга. По подразбиране то се центрира с отстъпи около него; превключете на „Запълване (изрязване)“, за да изрежете излишните краища.

Къде трябва да се поставят файловете на сайта ми?

Качете ги в основната папка на сайта си, така че favicon.ico да е достъпен на адрес /favicon.ico, след което поставете генерираните редове в секцията <head> на страниците си. Браузърите сами избират правилния размер.

Какво прави инструментът Генератор на фавикони

Този инструмент приема един-единствен файл с изображение, предоставен от Вас, и го преобразува в колекция от файлове с икони, подходящи за различни цели на уебсайта. Те включват икони за раздели на браузъра, Apple touch икони и икони за прогресивни уеб приложения (PWAs). След това инструментът пакетира тези икони в ZIP архив, който можете да изтеглите, и предоставя необходимия HTML код за лесното им интегриране във Вашия уебсайт.

При зареждане на изображението инструментът показва неговата ширина и височина чрез индикатора за размери {w} × {h} px.

Поддържани входящи файлове и изисквания

За да генерирате пакет с икони, трябва да качите изображение, което отговаря на следните условия:

  • Тип на файла: Поддържат се само PNG, JPG и SVG изображения.
  • Ограничение за размер на файла: Допускат се файлове с размер до 50 MB.
  • Препоръчителен размер: За PNG или JPG формати се препоръчва размер от поне 512 × 512 пиксела. Използването на по-малки изображения може да доведе до мек и размазан вид на големите икони.

Настройки за неквадратни изображения и фон

Иконите винаги са квадратни, но ако Вашето изходно изображение не е квадратно, инструментът предлага две опции за напасване, без да разтяга изображението:

  • Побиране (с отстъп): Цялото изображение остава видимо и се центрира, като около него се добавят отстъпи. Това е поведението по подразбиране за неквадратни изображения.
  • Запълване (изрязване): Изображението запълва изцяло квадратната форма, а излизащите извън нея краища се изрязват.

По отношение на фона можете да изберете следните настройки:

  • Прозрачен: По подразбиране фонът е прозрачен. Този вариант е изключително подходящ за раздели на браузъра.
  • Цвят: Можете да изберете конкретен цвят на фона. Използването на фонов цвят е по-сигурен избор за иконите на началния екран на iPhone, тъй като операционната система запълва прозрачните зони с черно.

Какво съдържа генерираният пакет с икони

След приключване на процеса ще получите готов ZIP архив за изтегляне, който съдържа следните файлове:

  • favicon.ico: Класическа икона за раздел, съдържаща версии с размери 16, 32 и 48 пиксела.
  • PNG икони: Икони с размери 16, 32, 180, 192 и 512 пиксела.
  • site.webmanifest: Малък текстов файл, който описва и указва на устройствата къде се намират големите икони.
  • Векторен файл: Ако сте започнали с изходно изображение в SVG формат, самият векторен файл се включва в пакета, което гарантира перфектна яснота при всеки размер.
  • Код за вграждане: HTML код, който да копирате и поставите в секцията <head> на Вашите уеб страници.

Поверителност и обработка на данните

Вашата поверителност е напълно защитена при използването на този инструмент. Вашето изображение се превръща в икони директно във Вашия браузър. Нищо не се качва в BroBroGo.

Възможни грешки и как да ги разрешите

По време на работа с инструмента може да срещнете следните съобщения за грешка:

  • "Този файл не можа да бъде отворен като изображение. Възможно е да е повреден, празен или да не е изображение." – Появява се, ако файлът е повреден или форматът му не се разпознава.
  • "Този SVG файл не можа да бъде прочетен. Проверете дали файлът е валиден SVG документ." – Показва се при проблем със структурата на качения SVG файл.
  • "Поддържат се само PNG, JPG и SVG изображения." – Появява се, ако се опитате да качите несъвместим файлов формат.
  • "Този файл е над 50 MB. Използвайте по-малко изходно изображение." – Означава, че файлът надвишава лимита за размер.
  • "Първо изберете PNG, JPG или SVG изображение." – Появява се, ако се опитате да стартирате процеса без зареден файл.
  • "Малкият източник ({w} × {h} px): големите икони може да изглеждат размазани. За най-добри резултати използвайте 512 × 512 или по-голям — или SVG файл." – Предупреждение, че разделителната способност на каченото изображение е твърде ниска.
  • "Генерирането не бе успешно. Опитайте с друго изображение." – Обща грешка при неуспешно създаване на пакета с икони.

Често задавани въпроси (FAQ)

Кои файлове са включени в пакета с икони?

Пакетът съдържа favicon.ico (с версии от 16, 32 и 48 пиксела вътре), PNG икони с размери 16, 32, 180, 192 и 512 пиксела, както и файл site.webmanifest, който описва големите икони. Ако започнете от SVG, самият векторен файл също се включва. Всичко това е събрано в един ZIP архив.

Какъв размер трябва да бъде изходното изображение?

Файл в SVG формат е идеален, тъй като всяка икона се изчертава от вектора и остава ясна дори при 16 пиксела. За PNG или JPG се препоръчва да започнете с размер поне 512 × 512 пиксела; по-малките изображения се увеличават автоматично и могат да изглеждат размазани.

Трябва ли фонът да бъде прозрачен или цветен?

Иконите за раздели на браузъра изглеждат отлично с прозрачен фон. Началните екрани на iPhone и iPad обаче запълват прозрачните зони с черен цвят. Ако потребителите могат да добавят сайта Ви към началния си екран, изборът на фонов цвят е по-сигурен.

Какво се случва с изображение, което не е квадратно?

Иконите винаги са квадратни, но Вашето изображение никога не се разтяга. По подразбиране то се центрира с отстъпи около него. Можете да превключите на опцията „Запълване (изрязване)“, за да изрежете излишните краища, които излизат извън квадрата.

Къде трябва да се поставят файловете на сайта ми?

Качете всички генерирани файлове в основната папка на сайта си, така че favicon.ico да бъде достъпен директно на адрес /favicon.ico. След това поставете предоставените HTML редове в секцията <head> на Вашите страници. Браузърите сами ще изберат и заредят правилния размер.