Favicon w Webflow: jak dodać favicon i webclip

Dodaj favicon i webclip w Webflow: gdzie jest ustawienie Icons, jakie rozmiary generuje Webflow, jak opublikować zmianę i co robić, gdy ikona się nie aktualizuje.

Najczęściej zadawane pytania

Jakiego rozmiaru powinien być favicon w Webflow?

Centrum pomocy Webflow podaje favicon 32x32 i webclip 256x256. W obecnym procesie przesyłasz jeden kwadratowy obraz, a Webflow sam generuje pozostałe rozmiary. Zacznij więc od kwadratowego pliku o wymiarach co najmniej 256x256 pikseli, który pozostaje czytelny po zmniejszeniu.

Gdzie w Webflow przesłać favicon?

Otwórz Site settings (Ustawienia witryny), przejdź do General (Ogólne) i znajdź sekcję Icons. Prześlij kwadratowy obraz, wybierz, które ikony mają zostać zaktualizowane, zatwierdź zmianę, a następnie opublikuj witrynę. Starsze poradniki nazywają to miejsce Project settings, ale chodzi o to samo ustawienie.

Czym jest webclip w Webflow?

Webclip to większa ikona używana, gdy ktoś zapisuje Twoją witrynę na ekranie głównym telefonu lub w podobnym skrócie. Webflow podaje dla niej rozmiar 256x256 pikseli. Jest ona oddzielna od małej ikony widocznej na karcie przeglądarki.

Dlaczego mój favicon w Webflow się nie wyświetla po przesłaniu?

Najczęstsza przyczyna to brak publikacji witryny po przesłaniu, ponieważ ikony zmieniają się tylko na opublikowanej stronie. Druga to pamięć podręczna przeglądarki. Opublikuj witrynę i sprawdź ją w oknie prywatnym lub innej przeglądarce, zanim uznasz, że przesyłanie się nie udało.

Czy Webflow obsługuje favicony SVG lub w trybie ciemnym?

Według informacji o aktualizacjach Webflow możesz przesłać plik PNG, JPG, GIF, ICO lub SVG, a artykuł w centrum pomocy wspomina o opcjonalnej ikonie karty przeglądarki dla trybu ciemnego. Webflow konwertuje też pliki SVG na PNG, aby zapewnić zgodność między przeglądarkami, więc sprawdź efekt w przeglądarkach, które są dla Ciebie ważne.

Po jakim czasie Google pokaże mój nowy favicon z Webflow?

Nie ma ustalonego terminu. Google sam decyduje, kiedy ponownie przeskanować stronę i odświeżyć ikonę w wynikach wyszukiwania, a z relacji społeczności wynika, że trwa to od kilku dni do kilku tygodni, a czasem dłużej. Ty możesz zadbać o to, by ikona była aktywna na opublikowanej witrynie.

Krótka odpowiedź: w Webflow otwórz Site settings > General > Icons, prześlij jeden kwadratowy obraz, wybierz, które ikony zaktualizować (favicon jasny, opcjonalny favicon dla trybu ciemnego, webclip), zatwierdź zmianę i opublikuj witrynę. Webflow podaje favicon 32x32 i webclip 256x256, a pozostałe rozmiary generuje z przesłanego pliku. Dopóki nie opublikujesz, na działającej stronie nic się nie zmieni. (Sprawdzono w listopadzie 2026 w centrum pomocy Webflow i informacjach o aktualizacjach.)

Czego wymaga Webflow

Starsze poradniki opisują dwa osobne pola przesyłania: jedno na favicon 32x32, drugie na webclip 256x256. Obecny artykuł w centrum pomocy Webflow opisuje prostszy proces: przesyłasz jeden kwadratowy obraz, a Webflow zajmuje się dopasowaniem rozmiarów. Oto do czego służy każda z ikon.

Ikona	Rozmiar podany przez Webflow	Gdzie jest widoczna
Favicon (jasny)	32x32	Karty przeglądarki i zakładki
Favicon (tryb ciemny, opcjonalny)	32x32	Karty przeglądarki w trybie ciemnym
Webclip	256x256	Skróty na ekranie głównym i podobne zapisane linki
Dodatkowe, generowane automatycznie	favicon 48x48, ikony dotykowe 180x180 i 192x192	Generowane przez Webflow na podstawie Twojego pliku

Akceptowane formaty przesyłania według informacji o aktualizacjach Webflow: PNG, JPG, GIF, ICO i SVG. Pliki SVG są zamieniane na PNG dla zgodności między przeglądarkami.

Więcej o rozmiarach na różnych platformach znajdziesz w naszym przewodniku po rozmiarach favicon.

Najpierw przygotuj obraz

Favicon na karcie ma zaledwie około 16–32 pikseli szerokości, więc większe znaczenie ma plik źródłowy niż same ustawienia.

Zacznij od kwadratu. Wyeksportuj kwadratowe płótno o wymiarach 256x256 lub większe, aby webclip nie był powiększany.
Upraszczaj. Użyj znaku graficznego lub jednej litery zamiast pełnego logotypu z napisem. Drobne detale w rozmiarze karty zamieniają się w plamę.
Uważaj na tło. Przezroczysty PNG dobrze wygląda na jasnych kartach, ale na ciemnych może zniknąć. Jeśli używasz favicona dla trybu ciemnego, przygotuj wersję z jasnym znakiem.
Użyj neutralnej nazwy pliku. Nazwy przesłanych zasobów mogą trafić do opublikowanego kodu HTML, więc unikaj nazw w stylu „final_v3_REAL.png”.

Jak dodać favicon i webclip w Webflow

Otwórz projekt w Webflow Designer lub w panelu i przejdź do Site settings.
Wybierz kartę General i przewiń do sekcji Icons.
Kliknij Upload icon i wybierz kwadratowy obraz.
Wybierz, które ikony ma zaktualizować ten obraz: favicon, opcjonalny favicon dla trybu ciemnego i webclip.
Jeśli chcesz użyć innej ikony dla trybu ciemnego, dodaj ją w odpowiednim polu. Ten krok jest opcjonalny.
Kliknij Apply. Brzmienie elementów interfejsu może się nieco zmieniać wraz z aktualizacjami Webflow, więc kieruj się etykietami, które widzisz.
Opublikuj witrynę na swoich domenach. Samo zapisanie nie przenosi ikon na działającą stronę.
Otwórz działającą stronę w oknie prywatnym i sprawdź kartę.

Lista kontrolna do skopiowania

`` [ ] Kwadratowy obraz źródłowy, 256x256 lub większy [ ] Znak jest na tyle prosty, że czytelny w rozmiarze karty [ ] Sprawdzono w jasnym i ciemnym motywie przeglądarki [ ] Przesłano w Site settings > General > Icons [ ] Zatwierdzono zmianę (Apply) [ ] Opublikowano na działającej domenie (a nie tylko na domenie testowej webflow.io) [ ] Sprawdzono w oknie prywatnym [ ] Odświeżono twardo stronę lub wyczyszczono pamięć podręczną, jeśli stara ikona nadal się wyświetla ``

Rozwiązywanie problemów

Favicon nadal pokazuje starą ikonę lub logo Webflow

Przejdź przez te kroki po kolei:

Opublikuj ponownie. Ikony trafiają na działającą stronę tylko po publikacji. Jeśli publikujesz na kilku domenach, uwzględnij wszystkie.
Sprawdź w oknie prywatnym. Przeglądarki bardzo agresywnie zapisują favicony w pamięci podręcznej, więc zwykła karta może długo pokazywać starą ikonę.
Odśwież stronę twardo albo zamknij i ponownie otwórz przeglądarkę.
Otwórz plik bezpośrednio. Sprawdź, czy adres URL ikony z kodu źródłowego strony ładuje się w osobnej karcie.

Przesłany plik jest odrzucany lub wygląda na zniekształcony

W niektórych wątkach społeczności pojawiają się błędy rozmiaru w starszych procesach, które wymagały dokładnych wymiarów. Jeśli na nie trafisz, użyj kwadratowego obrazu i spróbuj ponownie, a jeśli problem się utrzymuje, spróbuj w innej przeglądarce lub w oknie prywatnym. Ta rada pochodzi z relacji na forach, a nie z dokumentacji Webflow, więc traktuj ją jako obejście.

Wyniki wyszukiwania Google pokazują złą ikonę

Ikoną w wynikach wyszukiwania zarządza Google, a nie Webflow. Wątki społeczności opisują aktualizacje trwające dni, tygodnie, a czasem dłużej. Upewnij się, że ikona ładuje się na działającej stronie, i poczekaj. Pomaga stała, kwadratowa ikona pod niezmiennym adresem URL.

Ikona jest rozmyta na kartach

Zwykle oznacza to, że plik źródłowy zawiera zbyt wiele szczegółów albo od początku miał niską rozdzielczość. Narysuj prostszy znak w większym rozmiarze i prześlij go ponownie.

Jaki format przesłać?

Format	Sprawdza się w	Na co uważać
PNG	Większość stron; niezawodny i obsługuje przezroczystość	Wymaga wystarczającej rozdzielczości dla webclipa
SVG	Czysta grafika źródłowa	Webflow zamienia go na PNG, więc sprawdź podgląd efektu
ICO	Starsze procesy pracy	Często zbędny, gdy Webflow sam generuje rozmiary
JPG	Rzadko dobry wybór	Brak przezroczystości; zostawia prostokąt tła

Jeśli nie masz pewności, najbezpieczniejszy będzie kwadratowy PNG o wymiarach 256x256 lub większych.

Miejsce w przygotowaniach do startu

Favicon to drobny element listy kontrolnej przed startem, obok tytułów, opisów i obrazów do mediów społecznościowych. Jeśli porównujesz platformy, zanim się zdecydujesz, nasze strony porównanie z Webflow i alternatywy dla Webflow omawiają kompromisy, a ogólny przewodnik po zmianie favicon przyda się, jeśli zarządzasz witrynami na więcej niż jednej platformie.

Jeśli wolisz zacząć od gotowego układu, darmowy plan We.Inc pozwala opublikować do trzech witryn z gotowych szablonów, a kreator AI, który tworzy witrynę na podstawie opisu, jest dostępny od planu Starter za $20 miesięcznie. Możesz zarejestrować się tutaj.