20 przycisków mediów społecznościowych HTML5 i Bootstrap 2022
Opublikowany: 2022-07-15Uwolnij potencjał sieci społecznościowych, korzystając z tych najlepszych (i najfajniejszych) szablonów przycisków społecznościowych – bezpłatnie.
Sprawdziliśmy wiele dostępnych przycisków i ikon w Internecie, ale zdecydowaliśmy się na te 21.
Dzięki różnorodności tej kolekcji bez trudu znajdziesz odpowiedni styl .
To się nie kończy.
Jeśli chcesz, możesz je również upiększyć i oznakować zgodnie z Twoją firmą i witryną.
Efekt udostępniania społecznościowego może przynieść bardzo pozytywne rezultaty . Sami widzieliśmy to nawet w niszach, które mogą nie być zbyt popularne na Facebooku, Instagramie itp.
Możesz użyć tych przycisków społecznościowych Bootstrap, aby udostępnić WSZYSTKO, co chcesz.
Bądź towarzyski!
Guziki Bootstrap V15
Mamy dla Ciebie mnóstwo różnych wariantów przycisków, ale zdecydowaliśmy się uwzględnić tylko te, które przyniosą Ci największe korzyści. Zauważysz również, że zestawy zawierają wiele przycisków, a nie tylko te w mediach społecznościowych.
Wygrywasz wielki czas.
Bootstrap Buttons V15 to chyba mój ulubiony zestaw z listy. Przyciski społecznościowe są dostępne w dwóch różnych formatach z fajnym efektem cienia, który znika po najechaniu myszą.
Guziki Bootstrap V18
Bootstrap Buttons V18 to kolekcja różnych przycisków bardzo RÓŻNYCH od innych. Mimo to dostajesz też bardziej tradycyjne, więc możesz wybrać dowolną ścieżkę.
Nawet jeśli nie zauważysz tego na pierwszy rzut oka, każdy przycisk zawiera również cień, który tworzy fajny efekt kliknięcia (znikając).
Możesz spróbować samodzielnie, odwiedzając stronę podglądu demonstracji na żywo.
Guziki Bootstrap V13
Mimo że Bootstrap Buttons V13 są na ciemnym tle, możesz ich używać z innymi stylami tła. Nie zawsze musisz przestrzegać domyślnych konfiguracji.
Zapraszam do pójścia pod prąd.
Tutaj znajdziesz kilka różnych stylów przycisków mediów społecznościowych, więc na pewno znajdziesz projekt, który najbardziej Ci odpowiada . Połowa ma jednolity kolor, a połowa tylko kontur.
Guziki Bootstrap V01
Pakiet prostych i wszechstronnych przycisków społecznościowych HTML, które można szybko zintegrować z dowolną witryną lub blogiem. Podążają za marką każdej platformy społecznościowej, więc możesz je zatrudnić bez zmian.
Oprócz odmiany o jednolitej strukturze kolorystycznej są też takie, które mają tylko kontur.
Co więcej, obie wersje posiadają efekt KLIKNIĘCIA, który działa poprzez usuwanie cienia.
Fantazyjna animacja płaskiego przycisku społecznościowego autorstwa Colorlib
Colorlib przenosi fajne animacje CSS3 na wyższy poziom dzięki swojemu zestawowi ikon społecznościowych Fancy Flat Animated. Posiadamy wiodące ikony sieci społecznościowych LinkedIn, Twitter, Instagram, Youtube, Github i Facebook wbudowane w proste kwadratowe tła .
Wiele innych ikon jest również dostępnych dzięki bibliotece Font Awesome, która jest do Twojej dyspozycji.
Po najechaniu/kliknięciem na każdą z ikon uruchamia się określona ANIMACJA, która zamienia ikony w okrąg, a nie w domyślny kwadrat. To może być fajny dodatek do już dynamicznej i interaktywnej strony internetowej.
Przyciski społecznościowe animowane za pomocą Sass
Następnie mamy zestaw ikon społecznościowych animowanych przez SASS od Colorlib, który zawiera specyficzne podpowiedzi dla każdej ikony.
Na przykład, gdy ktoś najedzie kursorem na jedną z ikon, natychmiast otrzyma podpowiedź z informacją, o czym jest ta ikona. Możesz W PEŁNI dostosować ją, aby odzwierciedlała Twoje pomysły i wiadomości, lub po prostu pozostawić je jako domyślne, określając sieć społecznościową.
Ikony są również dostępne dla GitHub, poczty e-mail, Facebooka, LinkedIn, Twittera, Instagrama, Youtube i innych sieci społecznościowych opartych na Font Awesome .
Ponadto domyślny schemat kolorów to szare tło z białym tekstem ikony.
Czcionka Awesome Social Buttons Obsługiwane przez Bootstrap
Na koniec mamy połączenie dwóch bardzo popularnych frameworków w sieci — Bootstrap i Font Awesome.
Wyobraź sobie, że ta dwójka miałaby dziecko, co byś dostała ten niesamowity zestaw ikon od nikogo innego jak Stana Williamsa. Te ikony będą rozciągać się aż do GitHub, Apple, Android, Skype i Stack Overflow oraz całej biblioteki Font Awesome zawierającej setki ikon.
Jest to zestaw do zdobycia, jeśli potrzebujesz kolorów i instrukcji STRICT dla swoich potrzeb społecznych.
Minimalne przyciski społecznościowe CSS/HTML według Colorlib
Oto kilka fajnych ikon społecznościowych z Colorlib. Ten zestaw zawiera szarą ikonę dla Facebooka, Twittera, Instagrama, Youtube, Behance i setek innych.
Colorlib dodał łatwe do usunięcia obramowanie , które sprawia, że ikony wyglądają na bardziej zwarte i będą znacznie łatwiejsze do zintegrowania z projektami.
Jednak zawsze możesz wyeliminować obramowanie i użyć ikon, które lubisz. Na przykład w menu nawigacyjnym stopki lub nagłówka lub w obszarach zawartości.
Przyciski społecznościowe z przesuwanym kursorem
Wspaniale jest obserwować ewolucję sieci, a zwłaszcza aspekty projektowania języków takich jak CSS3 i HTML5. Oto piękny i nowoczesny zestaw ikon pochodzący z Colorlib.
Ten zestaw zawiera cztery główne sieci społecznościowe (LinkedIn, Twitter i Facebook) w pięknej aranżacji kolorów i pudełkowe etui do przechowywania ikon.
Efekt najechania został stworzony, aby pomóc Ci zamaskować domyślne widżety udostępniania w sieciach społecznościowych za pomocą bardziej atrakcyjnych ikon społecznościowych.
Po najechaniu na TWOJĄ WERSJĘ ikon, użytkownik będzie mógł zobaczyć bezpośrednie przyciski Lubię to, Udostępnij i Tweetuj z rzeczywistą liczbą udostępnień!
Udostępnij przyciski społecznościowe
Colorlib udostępnia bardzo lekki zestaw przycisków udostępniania społecznościowego, który wykorzystuje HTML5, aby zapewnić bardzo fajną funkcję.
Otrzymujesz prosty widżet „ikona udostępniania”, który możesz dodać do swojej witryny, ale po kliknięciu widżetu wiele serwisów społecznościowych EXPANDS może zostać wykorzystanych do udostępniania treści lub promowania własnych profili w mediach społecznościowych.
W zwykły sposób Colorlib te ikony są dostarczane z pełną biblioteką Font Awesome ze wszystkimi setkami ikon.
Stylowe przyciski społecznościowe
Chris Deacy dostarcza nam zestaw stylowych ikon społecznościowych, które zapewnią efekty tła najechania kursorem, zapewniając MAKSYMALNĄ interaktywność między ikonami a użytkownikiem.
Każdy zestaw ikon społecznościowych zawiera wiele ikon specyficznych dla sieci społecznościowych, a w tym znajdziemy Twitter, Facebook, Skype i Dribble.
Za każdym razem, gdy najedziesz kursorem na jedną z ikon, tło ikony zostanie wypełnione najbardziej dominującym kolorem każdej z sieci społecznościowych.
Całkiem fajna funkcja, która nie pozostanie niezauważona !
Przyciski społecznościowe używające tylko HTML
Zestaw ikon społecznościowych tylko w formacie HTML od OstrIO to idealne rozwiązanie dla webmasterów, projektantów i programistów, którzy potrzebują lekkiego rozwiązania do udostępniania mediów społecznościowych dla swoich minimalistycznych stron internetowych.
Zgadzamy się również, że te ikony będą KORZYSTAĆ z każdego projektu w skali, więc nie daj się ograniczać koncepcji tylko HTML.
Co więcej, zestaw ten ma cztery różne zestawy rozmiarów, dzięki czemu można go bardzo łatwo zintegrować ze stronami internetowymi o różnych rozmiarach i formach.
Dostępność ikon mediów społecznościowych waha się od Pinteresta do VKontakte, Facebooka i Twittera oraz INNYCH.
Animowane przyciski mediów społecznościowych
Te przyciski mediów społecznościowych mają fajną animację , ale mają też fajny efekt gradientu . Gdy już znajdziesz się na Twojej stronie lub blogu, wszyscy Twoi odwiedzający bez wątpienia je zauważą.
A kiedy już nad nimi zawisną, podekscytowanie przejdzie przez dach.
Czemu? Bo mówię jedno – nie spodziewali się tego!
Nawet jeśli chcesz, aby Twoja obecność w Internecie była schludna, zawsze możesz WZMACNIĆ rzeczy drobnymi szczegółami, takimi jak ikony mediów społecznościowych.
Nie zaśmiecają Twojej strony żadnymi dramatami, ale raczej zwiększą wrażenia.
Animowane ikony społecznościowe
Więcej animowanych ikon mediów społecznościowych pojawi się na Twojej drodze. Ta konkretna kolekcja wywołuje ten sam efekt dla wszystkich ikon, czy to Facebooka, Twittera, Pinteresta czy YouTube.
Kiedy najedziesz na nie kursorem myszy, krążą . Ten szablon sprawdzi się w przypadku czegoś nieco bardziej BASIC.
Niech Twoja witryna, blog lub sklep internetowy mają ikony mediów społecznościowych, które nie są nudne.
Nie kosztuje to nawet ani grosza, więc weź je w swoje ręce i przetestuj rzeczy na swojej stronie, aby zobaczyć, jak dobrze je ozdobią. Niewiele pracy dla niesamowitych rezultatów.
Przyciski i ikony społecznościowe CSS
Przyznajemy, że wiele zestawów ikon z naszej listy już jest naprawdę oszałamiających i zapewnią wspaniałe wrażenia z udostępniania społecznościowego milionom użytkowników sieci.
Ten ogromny zestaw przycisków i ikon społecznościowych CSS3 zrewolucjonizuje sposób wyświetlania informacji z mediów społecznościowych na stronach internetowych, aplikacjach, projektach, blogach i tak dalej.
Od prostych przycisków Evernote po bardziej TECHNICZNE, takie jak „Czytaj więcej w Smashing Magazine” lub „Dostępne w App Store” i tym podobne.
Tego rodzaju ikony dodadzą charakteru Twoim treściom. Zwiększy to również Twoje szanse na zdobycie akcji społecznościowych i sprzedaż
Okrągłe przyciski społecznościowe
Ikony kwadratowe są bardzo dominujące na obecnym rynku zestawów ikon społecznościowych.
Shahnur Alam chce to zmienić, dostarczając (budując siebie) ogromną liczbę okrągłych ikon społecznościowych dla najpopularniejszych sieci społecznościowych.
Ten konkretny zestaw pojawia się na stronach pisarzy MINIMALISTYCZNYCH, osobistych czasopismach i tym podobnych.
Przyciski społecznościowe z czcionkami ikon
David Pottrell od dłuższego czasu tworzy i udostępnia rzeczy. Jego przyciski społecznościowe z wbudowanymi czcionkami ikon należą do najpłynniejszych realizacji takiej koncepcji zestawu ikon.
Wizją Davida jest dostarczanie rozwiązań ikon społecznościowych z odpowiednimi schematami kolorów. Na domiar złego dodaje czcionkę z ikoną marki obok każdego elementu. Ta AKCJA przypieczętowuje umowę o autentyczność każdej z ikon.
Jesteśmy pod wrażeniem umiejętności HTML5 i CSS3, na które David zwraca naszą uwagę.
FLAT Beauty Social Button z przejściem CSS3
W naszym podsumowaniu projekt FLAT nie był spójny. Ale postaramy się to naprawić, wprowadzając naprawdę spektakularne i piękne dzieło SMTashrik Anam.
Chce dostarczać ikony, które wykorzystują EFEKTY PRZEJŚCIA CSS3, aby wzmocnić dynamiczne i interaktywne udostępnianie społecznościowe.
Przewiń każdą z ikon i obserwuj, jak się rozwijają, aby odkryć wybrany przez Ciebie tekst.
Uproszczone przyciski społecznościowe CSS
Prosty nigdy nie zawodzi, choć niektórzy mogą nazwać ten konkretny zestaw nowoczesnym i nieco złożonym . Naprawdę wierzymy, że jest to jeden z najprostszych zestawów społecznościowych na naszej liście do tej pory.
Możesz użyć tego szablonu zamiast bezpośredniego udostępniania przycisków społecznościowych na naszych stronach z treścią. Ten sprawdzi się szczególnie dobrze w sytuacjach, w których chcemy promować nasze profile. Ten pakiet obsługuje Forrst, Dribbble, Flickr, Designmoo i wiele innych.
Poświęć trochę czasu, aby to sprawdzić i być może PRZETESTUJ na swojej stronie przed podjęciem ostatecznej decyzji.
Przewiń przyciski społecznościowe
Zestaw ikon Roll Over zawiera ikony Soundcloud, Pinterest, Facebook, YouTube i Twitter.
Te ikony umożliwiają wstawienie tekstu najazdu . Te teksty pojawią się za każdym razem, gdy odwiedzający najedzie na jedną z ikon z tego zestawu.
Hugo Darby-Brown stworzył ten. Wykorzystał czystą technologię CSS3, aby stworzyć ten szablon i zapewnić tak bezproblemowe udostępnianie.
Wymienione powyżej i ikony społecznościowe oparte na HTML/CSS. Jeśli szukasz tych, których możesz użyć w Adobe Photoshop, Illustrator lub w inny sposób, możesz sprawdzić tę kolekcję ikon.
Daj nam znać, jeśli podoba Ci się post.