Konwerter do SVG

Dostęp do narzędzi grafikit.pl wymaga konta z aktywnym okresem próbnym lub subskrypcją — szczegóły znajdziesz na stronie Konto, okres próbny i subskrypcja. Samo narzędzie otwierasz pod adresem /svg-converter.php.

Do czego służy konwerter

Konwerter zamienia obraz rastrowy (JPG, PNG lub WebP) na plik SVG zbudowany ze ścieżek wektorowych. Najlepiej sprawdza się dla logo, ikon i płaskich ilustracji. W trybie Logo / ikona paleta powstaje z dokładnych kolorów występujących w pliku (np. #FE9923 pozostaje #FE9923), a przezroczystość jest obsługiwana osobno, dzięki czemu wynik nie ma rozmytych ani półprzezroczystych obwódek. Warstwy kolorów leżą na sobie, więc między kolorami nie ma jasnych szczelin.

Wektoryzacja odbywa się w Twojej przeglądarce — plik nie opuszcza urządzenia.

Szybki start

1. Otwórz Konwerter obrazów do SVG.
2. Przeciągnij plik na pole Przeciągnij i upuść plik JPG, PNG lub WebP albo kliknij w pole i wybierz plik.
3. Pod ustawieniami pojawi się podgląd: po lewej Oryginał, po prawej Wynik SVG. Pasek statusu pokaże „Wektoryzowanie…”, a po chwili np. „Gotowe: 800×600, 4 kol., 12 ścieżek, 6.3 KB (0.4 s).”.
4. Dopasuj tryb i suwaki. Każda zmiana automatycznie uruchamia ponowną wektoryzację (po ok. 0,3 s od ostatniej zmiany).
5. W razie potrzeby popraw kolory w sekcji Kolory w pliku SVG.
6. Kliknij Pobierz plik .svg albo Kopiuj kod SVG.

Wczytywanie pliku

Przeciągnij i upuść plik JPG, PNG lub WebP

Pole z podpisem „najlepiej logo PNG z przezroczystym tłem lub duży plik o płaskich kolorach”. Kliknięcie otwiera okno wyboru pliku; z klawiatury pole aktywujesz klawiszami Enter lub Spacja. Narzędzie przetwarza jeden plik naraz — jeśli zaznaczysz kilka, użyty zostanie pierwszy. Nowy plik zastępuje poprzedni.

Nazwa pliku wynikowego

Powstaje z nazwy wczytanego pliku bez rozszerzenia, z końcówką .svg (np. logo.png → logo.svg). Gdy nazwy nie da się ustalić, plik nazywa się obraz.svg.

Ograniczenie rozmiaru wejściowego

Dłuższy bok obrazu jest przy wczytywaniu zmniejszany do 4096 px (mniejsze obrazy zostają bez zmian). Wymiary SVG odpowiadają obrazowi po tym ewentualnym zmniejszeniu.

Inne typy plików

Plik innego typu niż JPG, PNG lub WebP zatrzymuje się z komunikatem „Obsługiwane formaty: JPG, PNG, WebP.”. Jeśli przeglądarka nie potrafi odczytać obrazu: „Nie udało się wczytać obrazu.”

Tryby: Logo / ikona i Ilustracja / zdjęcie

Pole wyboru Tryb ma dwie opcje (domyślnie pierwsza):

Przełączenie trybu zmienia zakres suwaka Maks. liczba kolorów i ukrywa lub pokazuje suwak Scalanie podobnych kolorów (szczegóły niżej) i od razu uruchamia ponowną wektoryzację.

Parametry (suwaki)

Maks. liczba kolorów

W trybie Logo / ikona: zakres 2–16, domyślnie 12. Tryb logo użyje tylu kolorów, ile naprawdę występuje w pliku, ale nie więcej niż ten limit. W trybie Ilustracja / zdjęcie: zakres 2–32; jeśli wartość była poniżej 8, po przełączeniu zostanie ustawiona na 16 (wartości 8 i wyższe pozostają bez zmian). Po powrocie do trybu logo wartość powyżej 16 wraca do 12. Liczba obok etykiety pokazuje bieżącą wartość.

Scalanie podobnych kolorów

Zakres 0–30, domyślnie 8. Tylko w trybie Logo / ikona (w drugim trybie pole jest ukryte). Wyższa wartość łączy zbliżone odcienie (np. artefakty kompresji JPG) w jeden kolor; 0 oznacza brak scalania. Podpowiedź: „Wyższa wartość łączy zbliżone odcienie (np. artefakty JPG) w jeden kolor.”

Dokładność krzywych

Cztery położenia: Niska, Średnia, Wysoka (domyślnie), Maksymalna. Wyższa dokładność wiernie odwzorowuje krzywizny i drobne szczegóły, ale zwiększa liczbę ścieżek i rozmiar pliku SVG; niższa upraszcza kształty.

Usuwanie drobnych plamek

Cztery położenia: Zachowaj wszystko, Mało (domyślnie), Średnio, Dużo. Im wyższe, tym więcej małych kształtów (kurz, szum, pojedyncze piksele) zostanie pominiętych. Przy logo z drobnymi detalami (kropki, cienkie linie) zmniejsz tę wartość.

Każde przesunięcie któregokolwiek z suwaków, przełączenie trybu lub zmiana pola Usuń jednolite tło automatycznie przelicza wynik.

Usuwanie tła i przezroczystość

Usuń jednolite tło (dla plików bez przezroczystości, np. JPG)

Pole wyboru. Narzędzie szuka najczęstszego koloru na obrzeżu obrazu i — jeśli zajmuje co najmniej połowę pikseli krawędzi — usuwa ten kolor z obszaru połączonego z krawędzią (tło staje się przezroczyste w SVG). Kolor tego samego odcienia wewnątrz obiektu (np. białe wnętrze litery „O”) nie jest usuwany, bo nie styka się z krawędzią obrazu. Gdy krawędź nie ma jednego dominującego koloru, nic się nie zmienia i nie pojawia się komunikat.

Pole nieaktywne

Jeśli wczytany plik ma już przezroczystość (jakikolwiek piksel o nieprzezroczystości poniżej 250 z 255), pole Usuń jednolite tło jest wyłączone i odznaczone — przezroczyste obszary zostaną zachowane automatycznie.

Jak traktowana jest przezroczystość

Piksele o nieprzezroczystości poniżej połowy (alfa < 128) stają się pustym miejscem w SVG; pozostałe są traktowane jako pełne. SVG nie odtwarza więc półprzezroczystych cieni ani miękkich krawędzi — wynik ma ostre krawędzie.

Podgląd: oryginał i wynik SVG

Sekcja podglądu jest ukryta do czasu wczytania pliku.

Tło podglądu

Lista z opcjami: Szachownica (widać przezroczystość), Białe, Ciemne. Zmienia wyłącznie tło za oryginałem i za wynikiem w oknie podglądu — nie wpływa na plik SVG. Szachownica pozwala sprawdzić, czy tło zostało usunięte; ciemne tło pomaga zobaczyć jasne logo.

Rozmiar podglądu

Suwak 160–480 px, krok 20, domyślnie 280 px. Ustawia wysokość obu okien podglądu. Zmiana nie przelicza wektoryzacji ani nie zmienia rozmiaru pliku.

Oryginał / Wynik SVG

Dwa okna obok siebie: wczytany obraz i wygenerowany wektor — porównaj krawędzie, kolory i szczegóły.

Edycja palety wynikowej

Sekcja Kolory w pliku SVG pokazuje listę kolorów użytych w wyniku — od największej powierzchni do najmniejszej. Każdy element to pole koloru (próbka) i kod HEX wielkimi literami.

1. Kliknij próbkę koloru — otworzy się systemowy wybór koloru.
2. Wybierz nowy kolor. Kod HEX obok próbki zmienia się od razu, a okno Wynik SVG pokazuje zmieniony wektor na żywo.
3. Kliknij Pobierz plik .svg lub Kopiuj kod SVG — wynik zawiera już poprawione kolory.

Pasek statusu i komunikaty

Pod podglądem znajduje się linia statusu (czytana przez czytniki ekranu). Możliwe komunikaty:

Kopiowanie i pobieranie

Kopiuj kod SVG

Kopiuje do schowka cały kod SVG jako tekst (np. aby wkleić go w kodzie strony lub edytorze kodu). Przycisk jest nieaktywny, dopóki nie ma wyniku. Wymaga zgody przeglądarki na dostęp do schowka (zwykle wystarczy połączenie HTTPS).

Pobierz plik .svg

Zapisuje plik nazwa.svg (typ image/svg+xml). W pliku jest jeden element <svg> z atrybutami width, height i viewBox równymi wymiarom obrazu oraz ścieżkami <path fill="#RRGGBB" …> — bez obrysów i bez osadzonego obrazu rastrowego.

Gotowy SVG możesz wstawić na stronę, otworzyć w programie graficznym albo użyć w edytorze napisów na zdjęciach — przyciski Zdjęcie tła i Obraz w edytorze przyjmują pliki obrazów (image/*), a kod edytora przewiduje także obrazy SVG.

Ograniczenia

• Formaty wejściowe: JPG, PNG, WebP. Jeden plik naraz.
• Dłuższy bok jest zmniejszany do 4096 px przy wczytywaniu; praktyczny limit zależy od pamięci i mocy urządzenia. Duże obrazy wektoryzują się dłużej (czas widać w pasku statusu).
• Wynik to „wektor kolorowych plam” — bez gradientów, półprzezroczystości, cieni i tekstu jako tekstu. Zdjęcia dają efekt plakatowy; do zdjęć lepiej użyć konwertera do WebP.
• Narzędzie nie ma opcji wyboru koloru tła do usunięcia ani ręcznego zaznaczania obszarów — tło usuwa się wyłącznie automatycznie polem Usuń jednolite tło.
• Wymaga włączonego JavaScriptu i nowoczesnej przeglądarki (kopiowanie do schowka wymaga zgody przeglądarki).

Typowe scenariusze

Jak zamienić logo na SVG

1. Przygotuj logo jako możliwie duży plik PNG, najlepiej z przezroczystym tłem.
2. Wczytaj plik; zostaw tryb Logo / ikona i ustawienia domyślne.
3. Porównaj okna Oryginał i Wynik SVG na tle Szachownica i Białe.
4. Jeśli w wyniku są niechciane odcienie, zwiększ Scalanie podobnych kolorów (np. do 12–15) albo obniż Maks. liczba kolorów. Jeśli giną drobne elementy, ustaw Usuwanie drobnych plamek na Zachowaj wszystko i podnieś Dokładność krzywych.
5. Kliknij Pobierz plik .svg.

Logo w JPG z białym tłem

1. Wczytaj plik JPG i zaznacz Usuń jednolite tło (dla plików bez przezroczystości, np. JPG).
2. Ustaw Tło podglądu na Szachownica i sprawdź, czy tło zniknęło.
3. Jeśli wokół logo zostały jasne plamki (artefakty JPG), zwiększ Scalanie podobnych kolorów albo Usuwanie drobnych plamek.
4. Pobierz plik.

Zmiana koloru marki w gotowym wektorze

1. Zwektoryzuj logo i dopracuj suwaki.
2. W sekcji Kolory w pliku SVG kliknij próbkę koloru, który chcesz zmienić, i wybierz nowy (np. kod z generatora palet kolorów).
3. Pobierz plik .svg — zawiera nowe kolory.

Plakatowa wersja ilustracji lub zdjęcia

1. Wczytaj plik i wybierz tryb Ilustracja / zdjęcie.
2. Ustaw Maks. liczba kolorów (np. 8–16 dla wyraźnego efektu plakatu, więcej dla większej wierności).
3. Przy dużej liczbie ścieżek obniż Dokładność krzywych lub podnieś Usuwanie drobnych plamek, aby zmniejszyć plik.

Rozwiązywanie problemów

Kolory w wyniku są inne niż w oryginale

Sprawdź, czy jesteś w trybie Logo / ikona — tryb Ilustracja / zdjęcie celowo uśrednia kolory. Jeśli kolor jest podobny do innego, może zostać scalony: zmniejsz Scalanie podobnych kolorów i zwiększ Maks. liczba kolorów.

Brakuje drobnych elementów

Ustaw Usuwanie drobnych plamek na Zachowaj wszystko i podnieś Dokładność krzywych.

Plik SVG jest bardzo duży lub ma tysiące ścieżek

Zmniejsz Dokładność krzywych, zwiększ Usuwanie drobnych plamek, obniż liczbę kolorów. Zdjęcia i obrazy z gradientami zawsze dają duże pliki.

Tło nie zostało usunięte

Pole działa tylko przy obrazach bez przezroczystości i tylko wtedy, gdy jeden kolor zajmuje co najmniej połowę krawędzi obrazu. Przy zdjęciach z nierównym tłem się nie powiedzie. Użyj plików z przezroczystym tłem.

Pole „Usuń jednolite tło” jest wyszarzone

Wczytany plik ma już przezroczystość — nie trzeba nic usuwać.

Wynik ma „schodki” lub jest rozmyty

Wczytaj większy plik źródłowy i ustaw Dokładność krzywych na Wysoka lub Maksymalna. Przy małych obrazach narzędzie powiększa obraz roboczo, ale nie odtworzy szczegółów, których nie ma w pliku.

Przyciski kopiowania i pobierania są nieaktywne

Wynik jeszcze się nie wygenerował albo wystąpił błąd. Poczekaj na komunikat „Gotowe: …”.

Wektoryzacja trwa długo lub się nie udaje

Zmniejsz plik przed wczytaniem albo obniż liczbę kolorów i dokładność krzywych.

Najczęstsze pytania

Czy mój plik jest wysyłany na serwer?

Nie. Wektoryzacja odbywa się w przeglądarce.

Czy mogę zamienić zdjęcie na SVG?

Możesz — tryb Ilustracja / zdjęcie da stylizowaną wersję plakatową. Nie otrzymasz wiernego odwzorowania fotografii.

Czy kolor #FE9923 zostanie dokładnie taki sam?

W trybie Logo / ikona kolory w wyniku pochodzą z dokładnych kolorów oryginału. Jeżeli zbliżony kolor zostanie scalony z sąsiednim, wynik przyjmie kolor dominujący.

Jak użyć SVG w edytorze napisów?

Wczytaj pobrany plik jako obraz lub tło w edytorze napisów.

Prywatność

Obraz jest odczytywany i wektoryzowany lokalnie przez skrypty działające w Twojej przeglądarce. Plik wejściowy ani wynik SVG nie są wysyłane na serwer grafikit.pl ani nigdzie zapisywane — po odświeżeniu strony znikają.

Nie znalazłeś odpowiedzi? Napisz do nas przez formularz kontaktowy.