Rodzina generatorów

Generator galerii ikon

Przeszukuj kompaktową bibliotekę ikon SVG, podglądaj na żywo swoje wybory stylistyczne, a następnie kopiuj pojedyncze ikony lub eksportuj arkusz sprite do wykorzystania w systemach projektowych, aplikacjach lub dokumentacji.

  • 24 wbudowane ikony liniowe z tagami do wyszukiwania
  • Kontrola rozmiaru, linii, koloru i tła na żywo
  • Kopiowanie lub pobieranie pojedynczych ikon
  • Eksport wybranych ikon jako jeden plik SVG sprite

Ustaw zasady dla ikon

Wszystkie ustawienia są stosowane po stronie klienta. Rozmiary podano w pikselach, grubość linii jest zaokrąglana do jednego miejsca po przecinku, a eksportowane symbole zachowują currentColor, dzięki czemu można zmienić ich kolor później w CSS.

Dopasowuje nazwy ikon i tagi, takie jak handel, pogoda czy media.

Filtruj galerię przed wybraniem ikon do eksportu.

Tylko litery, cyfry i myślniki. Nieprawidłowe znaki są usuwane automatycznie.

Dozwolony zakres: od 16 do 256 pikseli.

Dozwolony zakres: od 1.0 do 4.0.

Rogi pozostają zaokrąglone, aby zachować czytelność przy małych rozmiarach.

Użyj 3- lub 6-cyfrowego kodu hex, np. #16202B.

Używane tylko do podglądu w galerii. Pobrane pliki pozostają przezroczyste.

Eksportowane pliki SVG nadal używają przezroczystego tła.

0 ikon wybranych do eksportu.

Skopiuj wbudowany kod SVG do szybkiego użycia lub wybierz zestaw ikon i wygeneruj poniżej jeden plik sprite.

0 widoczne
0 wybrane

Eksport sprite

Wynikowy pakiet zawiera jeden <symbol> dla każdej wybranej ikony. Odwołaj się do każdej ikony później za pomocą <use href="#nazwa-ikony">. Jeśli nic nie zostanie wybrane, akcje eksportu pozostaną wyłączone i wyświetlą błąd.

Wybierz jedną lub więcej ikon, aby wygenerować podgląd arkusza sprite.


    


    

      

        

          
Jak to działa

          
Galeria używa znaczników SVG osadzonych bezpośrednio na stronie. Dane wejściowe są czyszczone, ograniczane do bezpiecznych zakresów i natychmiast renderowane ponownie, dzięki czemu podgląd i eksportowany kod pozostają zsynchronizowane.

        

      

      

        

          
1. Filtruj bibliotekę

          
Użyj wyszukiwania słów kluczowych i filtrów kategorii, aby zawęzić listę ikon. Wyszukiwanie dopasowuje zarówno nazwy ikon, jak i tagi, więc szersze terminy również działają.

        

        

          
2. Dostosuj prezentację

          
Rozmiar, grubość linii, styl zakończeń i kolory podglądu aktualizują każdą widoczną ikonę. Tło podglądu pomaga sprawdzić kontrast bez dodawania wypełnienia do eksportowanego pliku SVG.

        

        

          
3. Eksportuj to, czego potrzebujesz

          
Kopiuj lub pobieraj dowolną pojedynczą ikonę lub wybierz zestaw i wygeneruj jeden arkusz sprite. Identyfikatory sprite'ów używają wybranego prefiksu i są czyszczone do bezpiecznych nazw pisanych małymi literami.