Przejdź do poradnika
lil cactus

Jak utworzyć plik favicon ICO

Początkujący4 minutyZaktualizowano

Krótka odpowiedź

W Lil Cactus otwórz grafikę i wybierz Plik potem Eksportuj potem ICO… W polu Nazwa pliku wpisz favicon.ico. W sekcji Rozmiary ikon pozostaw zaznaczone wszystkie sześć rozmiarów (od 16 do 256 px; tak jest domyślnie) i kliknij przycisk Eksportuj. Pobrany plik ICO zawiera wszystkie sześć kwadratowych wersji.

Sześć wyeksportowanych rozmiarów ikony liścia na jasnym i ciemnym pasku: w górnym rzędzie każdego 16, 32, 48, 64, 128 i 256 pikseli, a poniżej 16 i 32 piksele powiększone czterokrotnie
Sześć rozmiarów w pliku favicon.ico na jasnym i ciemnym tle: w górnym rzędzie 16, 32, 48, 64, 128 i 256 px, poniżej 16 i 32 px powiększone 4×.
Czas
4 minuty
Poziom
Początkujący
Potrzebujesz
Ikona lub inna grafika otwarta w edytorze
Obsługiwane formaty
PNG, JPG, SVG, PSD i projekty Lil Cactus (przezroczystość zostaje zachowana)
Otwórz przykład w Lil CactusUżyj własnego zdjęcia

Za darmo, bez rejestracji. Twoje zdjęcie zostaje na Twoim komputerze.

Favicon to mała ikona obok karty lub zakładki strony internetowej. Proste kształty z dużymi płaszczyznami koloru łatwiej odczytać w małym rozmiarze. W tym ćwiczeniu użyjesz dwubarwnego liścia z jednym jasnym nerwem.

Eksport faviconu ICO w czterech krokach

  1. Otwórz grafikę

    Otwórz grafikę do ćwiczeń z tej strony. Własny plik otwórz poleceniem Plik potem Otwórz… Szachownica wokół liścia oznacza przezroczyste tło. Może pojawić się krótki komunikat o wygładzaniu krawędzi SVG; zamknie się sam.

    Menu „Plik” z zakreślonym poleceniem „Otwórz”
    Wczytaj grafikę, z której chcesz zrobić ikonę.

  2. Wybierz Plik › Eksportuj › ICO…

    Wybierz Plik potem Eksportuj potem ICO… Otworzy się okno Eksportuj jako ICO z podglądem grafiki.

    Menu „Plik” i podmenu „Eksportuj” z zakreślonym formatem ICO
    Otwórz okno eksportu do ICO.

  3. Wybierz nazwę pliku i rozmiary

    W polu Nazwa pliku wpisz favicon.ico. W sekcji Rozmiary ikon pozostaw zaznaczone 16, 32, 48, 64, 128 i 256. To wszystkie sześć dostępnych rozmiarów.

    Zakreślone pole „Nazwa pliku” eksportu ICO z wartością favicon.ico
    Nadaj nazwę pobieranemu plikowi ikony.
    Opcje eksportu ICO z zaznaczonymi rozmiarami 16, 32, 48, 64, 128 i 256 oraz zakreśloną grupą „Rozmiary ikon”
    Każda liczba to szerokość i zarazem wysokość kwadratowej ikony w pikselach.

  4. Wyeksportuj ICO

    Sprawdź, czy w stopce widać 6 rozmiarów ikony, i kliknij przycisk Eksportuj. Przeglądarka zapisze plik favicon.ico zgodnie ze swoimi ustawieniami pobierania lub miejsca zapisu.

    Stopka okna ICO z napisem „6 rozmiarów ikony”, przyciskiem „Anuluj” i zakreślonym przyciskiem „Eksportuj”
    Przed eksportem sprawdź liczbę wybranych rozmiarów.

Użyj ikony na swojej stronie

Prześlij plik favicon.ico do głównego folderu witryny, tak aby otwierał się pod adresem /favicon.ico. Możesz też wskazać go w sekcji <head> strony znacznikiem <link rel="icon" href="/favicon.ico"> (zobacz opis ikon w MDN).

Przeglądarki zapisują favicony w pamięci podręcznej, więc nowa ikona może pojawić się dopiero po odświeżeniu strony albo po pewnym czasie.

Gdy ikona 16 px jest nieczytelna

Uprość grafikę: mniej szczegółów, większe kształty i grubsze linie. Ilustracja na górze tej strony pokazuje, co pozostaje czytelne przy 16 px: dwie duże płaszczyzny koloru liścia i jego jeden gruby nerw.

Sprawdź, czy kształt wyróżnia się zarówno na jasnych, jak i na ciemnych paskach kart. Na ilustracji ciemnozielona połowa liścia prawie znika na ciemnym tle, a kształt niesie jasnozielona połowa. Grafika w jednym ciemnym kolorze byłaby tam słabo widoczna.

Co dalej

Pliki favicon ICO: pytania i odpowiedzi

Czy mogę zamienić PNG lub JPG na ICO?

Tak. W Lil Cactus oba formaty można otworzyć i wyeksportować za pomocą ustawień eksportu ICO. Ikoną staje się widoczna grafika.

Czy plik ICO może mieć przezroczyste tło?

Tak. W Lil Cactus format ICO zachowuje przezroczystość, która jest już w grafice. Jeśli miejsce wokół ikony ma być puste, najpierw usuń jednolite tło.

Co się dzieje z prostokątnym obrazem w pliku ICO?

W Lil Cactus obraz jest dopasowywany do każdego wybranego kwadratu bez rozciągania. Nadmiar miejsca wypełnia przezroczysty margines.

Czy mogę wyeksportować ICO tylko w jednym rozmiarze?

Tak. W Lil Cactus w sekcji „Rozmiary ikon” pozostaw zaznaczony tylko potrzebny rozmiar. Plik ICO będzie zawierał tylko ten jeden rozmiar.

Czy mogę zrobić ICO o rozmiarze 512 × 512 px?

Nie. W Lil Cactus największy rozmiar ICO to 256 × 256 px. Jeśli potrzebujesz większych wymiarów w pikselach, użyj PNG.

Czy mój obraz jest wysyłany, gdy tworzę ICO?

Nie. Lil Cactus tworzy plik ICO w przeglądarce i pobiera go na Twoje urządzenie; obraz nie trafia na serwer. Opcjonalne statystyki użycia opisuje strona o prywatności.

Opublikowano  · Ostatnio sprawdzono