Profesjonalne logo musi sprawdzać się w zupełnie różnych sytuacjach: małe jako favicon na karcie przeglądarki, średnie w nagłówku strony, duże na banerze na elewacji, kwadratowe jako zdjęcie profilowe na Instagramie i poziome na wizytówce. Każdy z tych kontekstów ma własne wymiary i formaty — a zły rozmiar kończy się rozmytym, przyciętym albo zniekształconym logo.
Dobra wiadomość: nie musisz tworzyć każdej wersji od zera. Mając właściwy plik we właściwym formacie, dopasujesz wymiary do dowolnego zastosowania w kilka sekund narzędziem Zmień rozmiar od ImageTools.
Formaty, w których warto mieć swoje logo
Zanim przejdziemy do konkretnych wymiarów, ustalmy, jakie pliki warto trzymać. Dobrze przygotowane logo powinno mieć przynajmniej te wersje:
- SVG (wektor): plik nadrzędny. Można go powiększyć do dowolnego rozmiaru — od 16-pikselowego favicona po dziesięciometrowy billboard — bez straty jakości. Niezbędny na stronach, w prezentacjach i przy wysyłce do drukarni.
- PNG z przezroczystym tłem (wysoka rozdzielczość): do zastosowań cyfrowych, w których SVG nie przechodzi. Zapisz go w co najmniej 1000×1000 px, żeby mieć zapas przy skalowaniu.
- PNG z białym tłem: tam, gdzie przezroczystość jest niepożądana albo nieobsługiwana — formularze rejestracyjne na platformach, dokumenty Word, e-maile.
- PNG lub JPG w wersji na ciemne tło (elementy w bieli): na kolorowe i ciemne tła. Granatowe logo znika kompletnie na czarnym tle.
- Favicon (.ico + pliki PNG): wersje przeznaczone na kartę przeglądarki. Wszystkie potrzebne rozmiary wygenerujesz z logo w narzędziu Generator favicon od ImageTools.
☁️ Trzymaj wszystko w chmurze. Trzymaj te pliki na Dysku Google albo w Dropboxie, pod ręką. Będą potrzebne przy zatrudnianiu freelancera, aktualizacji profilu w mediach społecznościowych czy wysyłce materiałów do drukarni — zwykle na już.
Tabela wymiarów logo według zastosowania
| Zastosowanie | Zalecane wymiary | Optymalny format | Uwagi |
|---|---|---|---|
| Nagłówek strony (desktop) | 200–400 px szerokości | SVG lub PNG z przezroczystością | Wysokość proporcjonalna do layoutu |
| Favicon (karta przeglądarki) | 16×16, 32×32, 48×48 px | .ico + PNG | Skorzystaj z generatora favicon |
| Apple Touch Icon (iOS) | 180×180 px | PNG bez przezroczystości | Zalecane jednolite tło |
| Ikona aplikacji Android (PWA) | 192×192 i 512×512 px | PNG | Wymagane w pliku webmanifest |
| Instagram — zdjęcie profilowe | 320×320 px (wyświetlane w 110 px) | PNG lub JPG | Zostanie przycięte do koła |
| Facebook — zdjęcie profilowe | 170×170 px | PNG lub JPG | Na komputerze wyświetlane jako koło |
| Facebook — zdjęcie w tle | 820×312 px | JPG lub PNG | Logo jako element, nie cała grafika |
| LinkedIn — logo firmy | 300×300 px | PNG lub JPG | Min. 300×300, maks. 4 MB |
| LinkedIn — tło profilu firmy | 1128×191 px | PNG lub JPG | Logo jako element grafiki w tle |
| YouTube — ikona kanału | 800×800 px | PNG lub JPG | Wyświetlana jako koło, 98 px na telewizorze |
| YouTube — grafika kanału | 2560×1440 px | JPG lub PNG | Logo jako element, bezpieczny obszar: 1546×423 px |
| WhatsApp Business — profil | 640×640 px | PNG lub JPG | Wyświetlane jako koło |
| TikTok — zdjęcie profilowe | 200×200 px (min.) | JPG lub PNG | Wyświetlane jako koło |
| Twitter / X — zdjęcie profilowe | 400×400 px | PNG lub JPG | Wyświetlane jako koło, 48 px na tablicy |
| E-mail (stopka) | 200–300 px szerokości | PNG z białym tłem lub JPG | Unikaj przezroczystości w starszych programach pocztowych |
| Wizytówka (plik cyfrowy) | 400–600 px szerokości | PNG z przezroczystością | Do złożenia w layoucie wizytówki |
| Prezentacja (slajdy) | 200–400 px szerokości | PNG z przezroczystością lub SVG | Proporcjonalnie do slajdu (16:9) |
Logo na stronę
Nagłówek strony
W nagłówku logo ma zwykle od 150 do 400 px szerokości, przy proporcjonalnej wysokości. Dokładna wartość zależy od layoutu — zwarty nagłówek zadowoli się 150 px, a strona z zapasem miejsca uniesie 300–400 px. Najważniejsze, żeby logo było ostre na ekranach Retina: wyeksportuj PNG o podwójnej szerokości wyświetlania (albo użyj SVG, który załatwia to sam) i zostaw sterowanie rozmiarem CSS-owi.
W nagłówku zawsze stosuj SVG albo PNG z przezroczystym tłem — tło nagłówka zmienia się wraz z projektem i przewijaniem, a logo z białym tłem zostawi widoczny biały prostokąt na kolorowym tle.
Favicon
Favicon to ikona widoczna na karcie przeglądarki, w zakładkach i na ekranie głównym urządzeń mobilnych. Skuteczny favicon jest uproszczoną wersją logo — zwykle samym znakiem albo inicjałem, bez pełnej nazwy firmy, bo miejsca jest zbyt mało na czytelny tekst.
Potrzebne rozmiary to: 16×16 px i 32×32 px dla przeglądarek na komputerach, 180×180 px dla iOS (Apple Touch Icon) oraz 192×192 px i 512×512 px dla Androida i aplikacji PWA. Skorzystaj z Generator favicon od ImageTools, żeby wygenerować wszystkie te rozmiary z logo automatycznie.
Wygeneruj wszystkie rozmiary favicona naraz
Od logo do favicona dla przeglądarek, iOS, Androida i PWA — wszystkie potrzebne rozmiary w kilka sekund.
Wygeneruj favicon za darmoLogo w mediach społecznościowych
Dlaczego logo musi działać w kwadracie i w kole
Praktycznie wszystkie serwisy społecznościowe wyświetlają zdjęcie profilowe w kole. To konkretny problem dla poziomych logo (nazwa i znak obok siebie): w okrągłym kadrze albo robią się zbyt małe, żeby je odczytać, albo tracą fragmenty przy krawędziach.
Najskuteczniej rozwiązuje to osobna wersja „ikonowa” — sam symbol albo inicjały marki wyśrodkowane w kwadracie — przeznaczona wyłącznie na zdjęcia profilowe. Rozpoznawalność zostaje, a problem przycinania znika.
Instagram przyjmuje zdjęcia profilowe do 320×320 px, ale wyświetla je w 110 px na profilu i w 32 px na tablicy. Plik musi być kwadratowy. Poziome logo wyśrodkuj w kwadracie z odpowiednim marginesem, żeby okrągłe przycięcie platformy nic nie ucięło.
Zdjęcie profilowe strony na Facebooku wyświetla się w 170×170 px na komputerze i 128×128 px na telefonie, zawsze przycięte do koła. Zdjęcie w tle ma 820×312 px — logo pojawia się w nim zwykle jako jeden z elementów kompozycji, a nie na całej powierzchni.
Na profilach firmowych LinkedIn pokazuje logo w 300×300 px (kwadrat) na stronie i w mniejszych rozmiarach na listach. To jedno z tych miejsc, gdzie jakość pliku najmocniej wpływa na odbiór profesjonalizmu — użyj PNG wysokiej jakości, bez nadmiernej kompresji.
YouTube
Ikona kanału na YouTubie wyświetla się w bardzo różnych rozmiarach: 98 px na telewizorze, 32 px na tablicy na komputerze, 88 px na profilu mobilnym. Plik powinien mieć co najmniej 800×800 px, żeby wszędzie pozostał ostry. Grafika kanału (baner) ma 2560×1440 px, ale bezpieczny obszar — widoczny na wszystkich urządzeniach — to zaledwie wyśrodkowane 1546×423 px. Logo musi się w nim zmieścić.
WhatsApp Business
Zdjęcie profilowe WhatsApp Business wyświetla się w kole, w rozmiarze około 50 px na liście rozmów. Wgraj plik 640×640 px, żeby podgląd na pełnym ekranie pozostał ostry. Jak w innych serwisach, poziome logo tu nie zadziała — użyj wersji ikonowej albo samego znaku marki.
📐 Wskazówka dla poziomych logo w mediach społecznościowych: zrób wersję kwadratową, dokładając po bokach białą przestrzeń (albo kolor tła marki). Najlepiej, gdy logo zajmuje od 60% do 75% szerokości kwadratu, z równymi marginesami z czterech stron. Wtedy okrągłe przycięcie nic nie zabiera i logo widać w całości.
Logo do druku
Druk rządzi się zupełnie inną logiką niż ekran. Liczy się nie sama liczba pikseli, ale jej stosunek do fizycznego rozmiaru wydruku, mierzony w DPI (dots per inch, punkty na cal). Standardem poligraficznym jest 300 DPI.
Jak obliczyć potrzebną liczbę pikseli do druku
Wzór: piksele = rozmiar w cm ÷ 2,54 × DPI
Przykłady z życia:
| Materiał | Typowy rozmiar logo | Potrzebne piksele (300 DPI) |
|---|---|---|
| Wizytówka (logo) | 3 × 1,5 cm | 354 × 177 px |
| Papier firmowy (nagłówek) | 5 × 2 cm | 591 × 236 px |
| Małe opakowanie | 4 × 4 cm | 472 × 472 px |
| Koszulka (nadruk na piersi) | 10 × 5 cm | 1181 × 591 px |
| Kubek (logo z boku) | 8 × 4 cm | 945 × 472 px |
| Torba z nadrukiem | 15 × 8 cm | 1772 × 945 px |
| Baner / rollup (logo u góry) | 20 × 10 cm | 2362 × 1181 px |
Żeby nie liczyć tego za każdym razem, najprościej korzystać z SVG — wektor skaluje się bez ograniczeń i można go wydrukować w dowolnym rozmiarze bez straty jakości. Każda profesjonalna drukarnia przyjmie SVG (albo jego odpowiednik w wektorowym PDF-ie, wygenerowany z SVG w Illustratorze lub Inkscape).
Formaty przyjmowane przez drukarnie
Większość profesjonalnych drukarni przyjmuje i preferuje:
- Wektorowy PDF: standard branżowy. Generowany z Illustratora, Corela albo Inkscape'a z logo w postaci wektorowej.
- AI (Adobe Illustrator): natywny plik wektorowy.
- EPS: starszy format wektorowy o bardzo szerokiej zgodności.
- SVG: przyjmowany przez większość nowoczesnych drukarni.
- PNG w wysokiej rozdzielczości: akceptowany, gdy nie ma pliku wektorowego, o ile rozdzielczość wystarcza do docelowego rozmiaru wydruku.
🖨️ Do haftu i cięcia laserowego: te procesy wymagają wektorów z czystymi ścieżkami. Logo z gradientami, cieniami czy efektami fotograficznymi trzeba przed produkcją uprościć. Jeśli oryginalny wektor nie istnieje, projektant może zrobić taką wektoryzację na podstawie pliku PNG.
Dopasowanie logo do każdego zastosowania
Mając plik bazowy logo w PNG o wysokiej rozdzielczości (co najmniej 1000×1000 px) albo w SVG, dopasuj go do wymiarów każdej platformy narzędziem Zmień rozmiar od ImageTools. Pozwala ono podać dokładną szerokość i wysokość w pikselach, zachowując albo zmieniając pierwotne proporcje.
Zalecana kolejność przy przygotowywaniu wersji logo:
- Zawsze wychodź od pliku o najwyższej dostępnej rozdzielczości — SVG albo PNG powyżej 1000 px.
- Przeskaluj plik do wymiarów docelowych w narzędziu Zmień rozmiar.
- Do mediów społecznościowych skompresuj go delikatnie narzędziem Kompresuj — jakość 85–90% zachowa ostrość.
- Do druku wyślij SVG wprost albo przekonwertuj go na wektorowy PDF.
Dopasuj logo do dowolnego zastosowania
Ustaw wymiary logo w pikselach co do jednego — bez zniekształcania proporcji.
Zmień rozmiar logo za darmoCzęste błędy przy używaniu logo w różnych rozmiarach
Ten sam plik do wszystkiego
Logo 2000 px w stopce e-maila ładuje się wolno i wyświetla ogromne. Logo 100 px na wydruku A4 rozsypie się na piksele. Każde zastosowanie ma własne optymalne wymiary — potraktuj ten poradnik jako punkt odniesienia i przeskaluj plik przed użyciem.
Brak wersji na ciemne tło
Wiele logo powstaje w ciemnych barwach na jasnym tle. W postach na czarnym albo kolorowym tle — codzienność w Instagram Stories czy w grafikach na LinkedInie — logo po prostu znika. Zawsze przygotuj i zapisz wersję z głównymi elementami w bieli lub w jasnym kolorze.
Zbyt duży PNG do mediów społecznościowych
PNG 2000×2000 px jako zdjęcie profilowe na Instagramie nic nie poprawia — platforma i tak kompresuje wszystko powyżej potrzebnego rozmiaru. Wgraj plik w optymalnych wymiarach (320×320 px) skompresowany do jakości 90%, żeby uniknąć podwójnej kompresji.
JPG do logo z przezroczystym tłem
JPG nie obsługuje przezroczystości — przy zapisie przezroczystego PNG do JPG tło zamienia się w biel. Jeśli logo ma mieć przezroczyste tło (żeby działało na różnych kolorach), zostań przy PNG albo WebP.
Powiększanie małego PNG zamiast sięgnięcia po SVG
Jeśli logo istnieje w SVG, zawsze skaluj z tego pliku — nigdy nie powiększaj małego PNG. Powiększony PNG rozsypuje się na piksele, a bez oryginalnego wektora nie da się tego naprawić.
Nie masz jeszcze logo? Zrób je teraz
Jeśli nie masz jeszcze logo albo chcesz je dopracować, ImageTools daje do wyboru dwa narzędzia: Kreator logo, w którym sam dobierasz znak, kolory i typografię, oraz Kreator logo AI, w którym opisujesz swoją markę, a AI generuje gotowe do pobrania propozycje wektorowe. Oba eksportują do SVG i PNG — czyli do formatów potrzebnych we wszystkich zastosowaniach opisanych w tym poradniku.
Stwórz logo swojej marki już teraz
Wynik w SVG i PNG z przezroczystym tłem — gotowy na stronę, do mediów społecznościowych i do druku.
Najczęściej zadawane pytania
prefers-color-scheme albo znacznik HTML <picture> z media, które automatycznie przełączają jasną i ciemną wersję logo według ustawień systemu odwiedzającego — bez żadnej akcji z jego strony.