50 małych narzędzi internetowych dla projektantów stron internetowych od 2022 r

Opublikowany: 2022-12-13

Wszystkie stworzone i wydane w tym roku, każda z tych bezpłatnych aplikacji internetowych oferuje oszczędzające czas rozwiązanie wielu zadań związanych z projektowaniem stron internetowych, które będziesz musiał wykonywać od czasu do czasu. Bez konieczności instalowania czegokolwiek, wszystko, co musisz zrobić, to dodać je do zakładek i zapisać na ten dzień, kiedy zostaną wezwane.

Niektóre z tych drobnych narzędzi oszczędzających czas pomogą Ci lepiej ocenić dostępność witryny, sprawdzić CSS pod kątem zbędnych klas, skopiować i wkleić animacje CSS, upiększyć zrzuty ekranu kodu i wiele więcej.

Niezależnie od tego, jakiego rozwiązania oszczędzającego czas przy projektowaniu stron internetowych szukasz, prawdopodobnie znajdziesz je tutaj.

Jeśli szukasz zeszłorocznej kolekcji małych narzędzi dla projektantów stron internetowych, oto wszystkie.

  • Narzędzia i generatory kolorów
  • Generatory wzorów i gradientów
  • Generatory zrzutów ekranu kodu
  • Narzędzia i edytory efektów graficznych
  • Narzędzia i generatory CSS
  • Generatory przycisków CSS
  • Analizatory jakości kodu CSS
  • Czcionki i narzędzia typograficzne
  • Narzędzia ułatwień dostępu w sieci
  • Zestawy ikon i narzędzia
  • Narzędzia Markdown i edytory online
  • Różne narzędzia i generatory

Narzędzia i generatory kolorów

Narzędzia barwy
Prosty zestaw narzędzi typu open source do pracy z kolorami. Obejmuje mieszanie kolorów, mieszanie, konwersję, modyfikację, szczegółowe informacje i wiele więcej.
Małe narzędzie dla projektantów stron internetowych hue.tools

Huemint
To narzędzie wykorzystuje uczenie maszynowe do tworzenia unikalnych schematów kolorów.
Małe małe narzędzie dla projektantów stron internetowych Huemint

Generator nazw kolorów
Wprowadź kod szesnastkowy, a ta aplikacja nada mu nazwę i wygeneruje zmienne CSS.
Małe narzędzie dla projektantów stron internetowych Generator nazw kolorów

Alfredo
Stwórz idealną skalę kolorów za pomocą tego internetowego generatora alfa.
Małe narzędzie dla projektantów stron internetowych Alphredo

Generatory wzorów i gradientów

Siatkowaty
To oparte na przeglądarce narzędzie pomoże Ci tworzyć gradienty siatki, które można eksportować jako obrazy PNG.
Małe, małe narzędzie dla projektantów stron internetowych Meshy

Gradienty
Użyj tego narzędzia online do tworzenia złożonych gradientów, które można eksportować w wielu formatach.
Małe, małe narzędzie dla projektantów stron internetowych Gradienty

Gradienty cieni CSS
Skopiuj i wklej kolorowy gradient cienia lub zaprojektuj własny za pomocą tego narzędzia internetowego.
Małe narzędzie dla projektantów stron internetowych Gradienty cieni CSS

Generatory zrzutów ekranu kodu

Pika
To narzędzie internetowe pomoże Ci tworzyć piękne zrzuty ekranu, które możesz udostępniać w mediach społecznościowych lub na blogu.
Małe narzędzie dla projektantów stron internetowych Pika

Tweetnij
Darmowe narzędzie do generowania udostępnianych obrazów Twoich tweetów.
Małe narzędzie dla projektantów stron internetowych Tweetlet

kod.so
Ta aplikacja przeglądarki pomoże Ci tworzyć piękne zrzuty ekranu fragmentów kodu.
Małe małe narzędzie dla projektantów stron internetowych kod.so

FabPic
Kolejna darmowa aplikacja przeglądarkowa do tworzenia niestandardowych zrzutów ekranu.
Małe małe narzędzie dla projektantów stron internetowych FabPic

Narzędzia i edytory efektów graficznych

Generator obrazu usterki
Przydatne narzędzie, które pozwala tworzyć i zapisywać unikalne obrazy z błędami.
Generator obrazu usterki

Paleta
Pokoloruj swoje stare zdjęcia za pomocą tej aplikacji opartej na sztucznej inteligencji.
Tiny Little Tool dla Web Designers Paleta

Magiczna gumka
Usuń niechciane elementy ze swoich zdjęć za pomocą tego bezpłatnego narzędzia.
Małe małe narzędzie dla projektantów stron internetowych Magiczna gumka

Narzędzia i generatory CSS

ładowarki
Chwyć asortyment ładowarek i błystek do następnego projektu.
Małe, małe narzędzie dla ładowarek projektantów stron internetowych

AnimatiSS
Użyj tej kolekcji gotowych animacji CSS w swoich projektach.
Małe małe narzędzie dla projektantów stron internetowych AnimatiSS

Cienie Pudełkowe
Wyselekcjonowana kolekcja pięknych cieni do kopiowania i wklejania dla Tailwind CSS.
Cienie Pudełkowe

Waniliowy powiew
Narzędzie online do konwersji elementów CSS Tailwind na semantyczny CSS.
Małe, małe narzędzie dla projektantów stron internetowych Vanilla Breeze

Kąty CSS Clothoid
To narzędzie online wygeneruje zaokrąglone rogi za pomocą CSS clip-path .
Małe narzędzie dla projektantów stron internetowych CSS Clothoid Corners

Generator tokenów projektu
Użyj tego narzędzia, aby szybko rozpocząć projekty CSS.
Małe narzędzie dla projektantów stron internetowych Generator tokenów projektowych

MetalliCSS
Ta biblioteka JavaScript o otwartym kodzie źródłowym dodaje metalicznego akcentu do każdego elementu projektu.
Małe narzędzie dla projektantów stron internetowych MetalliCSS

Wypełniacz interfejsu użytkownika
Mała biblioteka elementów zastępczych do kopiowania i wklejania dla projektów projektowych.
Małe małe narzędzie dla projektantów stron internetowych UI Filler

Generatory przycisków CSS

Generator przycisków
Wybieraj spośród wielu atrakcyjnych przycisków typu „kliknij, aby skopiować” dla swoich projektów.
Małe narzędzie dla projektantów stron internetowych Generator przycisków

Przyciski interfejsu użytkownika
Zbiór stylów przycisków CSS typu „kopiuj i wklej” do wykorzystania w projektach.
Małe małe narzędzie dla projektantów stron internetowych Przyciski interfejsu użytkownika

100 guzików
Bezpłatna kolekcja 100 nowoczesnych projektów przycisków CSS do wykorzystania w Twoich projektach.
Małe małe narzędzie dla projektantów stron internetowych 100 przycisków

Analizatory jakości kodu CSS

Kontroler CSS
Użyj tego narzędzia, aby zidentyfikować nadmiarowe klasy CSS.
Małe narzędzie dla projektantów stron internetowych Css Checker

Internetowy analizator jakości kodu CSS
To narzędzie ocenia Twój CSS na podstawie szeregu strażników jakości.
Małe narzędzie dla projektantów stron internetowych Internetowy analizator jakości kodu CSS

Minifikator CSS
Wklej swój CSS do tej aplikacji, a zmniejszy to twój kod.
Małe, małe narzędzie dla projektantów stron internetowych CSS Minifier

Czcionki i narzędzia typograficzne

Generator czcionek zastępczych
To narzędzie pomoże Ci uniknąć irytującego skumulowanego przesunięcia układu (CLS) w Twoich układach.
Małe narzędzie dla projektantów stron internetowych Generator czcionek zastępczych

Kalkulator skali typograficznej
Użyj tego narzędzia, aby stworzyć harmonijną skalę typu.
Małe narzędzie dla projektantów stron internetowych Kalkulator skali typograficznej

Czcionki króliczka
Sprawdź tę otwartą platformę czcionek internetowych, która zapewnia prywatność.
Małe małe narzędzie dla projektantów stron internetowych Bunny Fonts

Narzędzia ułatwień dostępu w sieci

Lista kontrolna dostępności sieci
Użyj tej listy kontrolnej do tworzenia dostępnych witryn internetowych i aplikacji internetowych.
Małe narzędzie dla projektantów stron internetowych Lista kontrolna ułatwień dostępu do sieci

Lista kontrolna projektu A11Y
Kwestie, które należy sprawdzić na tej liście kontrolnej, obejmują szeroki zakres schorzeń związanych z niepełnosprawnością.
Małe narzędzie dla projektantów stron internetowych Lista kontrolna projektu A11Y

Siatka kontrastu
To narzędzie pomoże Ci przetestować różne kombinacje kolorów pod kątem zgodności z WCAG 2.0.
Małe narzędzie dla projektantów stron internetowych Siatka kontrastu

Brak listy kontrolnej ułatwień dostępu
Użyj tej listy jako odniesienia podczas oceny dostępności witryny.
Małe narzędzie dla projektantów stron internetowych Lista kontrolna ułatwień dostępu

Dowiedz się o ułatwieniach dostępu
Wiecznie aktualny kurs ułatwień dostępu i materiały referencyjne, które pomogą Ci ulepszyć tworzenie stron internetowych.
Małe narzędzie dla projektantów stron internetowych Dowiedz się o ułatwieniach dostępu

Losowo11y
Użyj tego narzędzia do generowania losowo dostępnych palet kolorów.
Małe, małe narzędzie dla projektantów stron internetowych Randoma11y

Zestawy ikon i narzędzia

ikona
Przeszukuj 36 bibliotek bezpłatnych ikon, aby znaleźć idealne dopasowanie do swojego projektu.
Małe małe narzędzie dla projektantów stron internetowych Iconer

Podstawy
Pobierz tę kolekcję podstawowych ikon do projektowania i rozwoju produktów.
Małe, małe narzędzie dla Basicons projektantów stron internetowych

KopiujSymbol
Szukasz symbolu? Ta wyszukiwarka wyświetli ikonę, skrót klawiaturowy i kod CSS do kopiowania i wklejania.
Małe narzędzie dla projektantów stron internetowych CopySymbol

Aplikacja glify
Poręczna biblioteka symboli kopiowania i wklejania do wykorzystania w projektach.
Małe, małe narzędzie dla projektantów stron internetowych Glify

ikony
Znajdź idealną kolekcję ikon dla swojego projektu za pomocą tego narzędzia wyszukiwania.
Małe małe narzędzie dla projektantów stron internetowych Icones

Narzędzia Markdown i edytory online

Markdoc
Edytor oparty na przecenach do tworzenia niestandardowych witryn z dokumentacją.
Małe narzędzie dla projektantów stron internetowych Markdoc

LetsMarkdown.com
Wypróbuj ten edytor przeceny typu open source, który działa bezpośrednio w przeglądarce.
Małe narzędzie dla projektantów stron internetowych LetsMarkdown.com

pisarz
Fani przeceny będą chcieli wypróbować ten minimalny edytor.
Małe, małe narzędzie dla projektantów stron internetowych

Różne narzędzia i generatory

Wyszukiwanie fragmentów kodu
Ta wyszukiwarka zwróci odpowiednie fragmenty kodu dla Twoich zapytań.
Małe narzędzie dla projektantów stron internetowych Wyszukiwanie fragmentów kodu

Kopiuj książkę
Ten przydatny zasób zawiera często używany tekst występujący w aplikacjach internetowych.
Małe narzędzie dla projektantów stron internetowych Kopiuj książkę

Zasoby etycznego projektowania
Zbiór artykułów, organizacji, narzędzi i nie tylko, które promują etykę w projektowaniu.
Małe narzędzie dla projektantów stron internetowych Zasoby dotyczące etycznego projektowania

Fajny kreator SVG
Twórz niestandardowe pliki SVG za pomocą tego narzędzia opartego na przeglądarce.
Małe narzędzie dla projektantów stron internetowych Heazy SVG Creator

Proge
Sprawdź swoją wiedzę programistyczną w tej grze polegającej na odgadywaniu języka.
Małe małe narzędzie dla projektantów stron internetowych Proge

Wpisywanie RegEx
Sprawdź swoje umiejętności RegEx w tej grze logicznej.
Małe narzędzie dla projektantów stron internetowych Wpisywanie wyrażenia regularnego

Ruchliwość
Oparty na przeglądarce darmowy edytor ruchomych grafik.
Małe, małe narzędzie dla projektantów stron internetowych Motionity

metaSEO
Bezpłatne narzędzie internetowe do szybkiego generowania metatagów dla Twojej witryny lub treści.
metaSEO

Plac zabaw JavaScript
Ucz się i doskonal swoje umiejętności dzięki temu narzędziu online.
Małe, małe narzędzie dla projektantów stron internetowych JavaScript Playground