اینستاگرام
instagram.fileon.ir

کد آیکون شبکه های اجتماعی

نویسنده : محمد پارسایی | زمان انتشار : 27 اسفند 1400 ساعت 23:32

مجموعه بی نظیر از آیکون شبکه های اجتماعی استفاده شده در وب سایت که با html و css ساخته شده است. در ادامه می توانید این مجموعه بی نظیر و کدهای اماده آن را دانلود کنید و در وب سایت خود استفاده کنید.

طراح: Metty – November 18, 2018                                             نوشته شده با: CSS / HTML

دمو و کد

درباره کد

نام این آیکون، DARK SOCIAL ICONS به معنای آیکون تیره برای شبکه های اجتماعی می باشد که جذابیت خاصی به سایت شما می دهد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: matt henley – October 20, 2018                                             نوشته شده با: CSS / HTML

دمو و کد

درباره کد

این آیکون به نام Social media icons with hover and inverse actions می باشد. و هنگامی که موس روی آن هاور می شود تغییر ظاهر می دهد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: Ashish Anand – October 3, 2018                                            نوشته شده با: CSS / HTML

دمو و کد

درباره کد

این آیکون به نام SOCIAL MEDIA 3D GHOST BUTTONS می باشد. هنگامی که موس روی آیکون ها هاور می شود افکت های سه بعدی ایجاد می گردد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح:Stockin – September 28, 2018                                           نوشته شده با: CSS / HTML

دمو و کد

درباره کد

این آیکون به نام 3D – CSS SOCIAL TILES می باشد. شکلی شبیه به سفال و کاشی دارند و هنگامی که موس روی آیکون ها هاور می شود افکت های سه بعدی ایجاد می گردد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح:Stockin – September 27, 2018                                           نوشته شده با: CSS / HTML

دمو و کد

درباره کد

این آیکون به نام Floating social media icons in HTML and CSS می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: Nour Saud – February 13, 2018                                           نوشته شده با: CSS (SCSS) / HTML

دمو و کد

درباره کد

این آیکون به نام THE SOCIAL DRAWER می باشد. طراحی حالت کشویی برای لینک شبکه های اجتماعی

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari


طراح: Miguel Cast – July 6, 2017                                          نوشته شده با: CSS (SCSS) / HTML

دمو و کد

درباره کد

این آیکون به نام Social icons with vision 3D effect in HTML and CSS می باشد.

مرورگرهای سازگار:               Chrome, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: Dariusz Syncerek – June 11, 2017                                          نوشته شده با: CSS (SCSS) / HTML

دمو و کد

درباره کد

این آیکون به نام Pure CSS social buttons می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: fox_hover – March 27, 2017                                          نوشته شده با: CSS (SCSS) / HTML

دمو و کد

صفحه گیت هاب

درباره کد

این آیکون به نام CSS3 SOCIAL BUTTONS VOL.2 می باشد. این نمونه از آیکون با استفاده از CSS3 طراحی شده است.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: fox_hover – March 5, 2017                                          نوشته شده با: CSS (SCSS) / HTML

دمو و کد

صفحه گیت هاب

درباره کد

این آیکون به نام CSS3 SOCIAL BUTTONS VOL.1 می باشد. این نمونه از آیکون با استفاده از CSS3 طراحی شده است.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: Gabrielle Wee – January 20, 2017                                          نوشته شده با:  (CSS (SCSS) / HTML (Haml

دمو و کد

درباره کد

این آیکون به نام ONLY CSS DIRECTION-AWARE CUBE SOCIAL LINKS می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari


طراح: Luis Espinosa – August 29, 2016                                          نوشته شده با:  (CSS (SCSS) / HTML (Pug

دمو و کد

درباره کد

این آیکون به نام SOCIAL BUTTONS WITH TOOLTIPS می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              ionicons.css


طراح: Anthony Koch – October 23, 2015                                         نوشته شده با:  / JavaScript / CSS  / HTML

دمو و کد

dribbble page

درباره کد

این طرح در سایت دریبل موجود است که توسط Paul Flavius Nechita طراحی گردیده است. با وجود اینکه طرح بسیاری ساده ای می باشد اما از طرح های مورد علاقه ما می باشد

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              ionicons.css


طراح: Michael Rossi – October 21, 2015                                       نوشته شده با:  CSS (Less) / HTML

دمو و کد

درباره کد

این طرح به نام CLEAN SOCIAL BUTTONS می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: Chris Deacy  – March 20, 2015                                       نوشته شده با: (HTML (Pug) / CSS (Stylus)

دمو و کد

dribbble

درباره کد

این طرح به نام STYLISH SOCIAL BUTTONS می باشد. چند دکمه اجتماعی جالب با انیمیشن های صاف.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                              font-awesome.css


طراح: Kevin Dewar – March 13, 2015                                       نوشته شده با: (HTML  / CSS (SCSS

دمو و کد

درباره کد

این طرح به نام SVG SOCIAL ICONS می باشد. آیکون های اجتماعی دایره ای با SVG، HTML و CSS.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari


طراح: Sazzad – February 11, 2015                                       نوشته شده با: HTML  / CSS

دمو و کد

درباره کد

این طرح به نام SOCIAL LINKS – HTML and CSS social diamond links می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                            font-awesome.css


طراح: Kieran Hunter – November 13, 2014                                       نوشته شده با: HTML  / CSS

دمو و کد

درباره کد

این طرح به نام SOCIAL MEDIA ICONS – Social media hover icons with pop-up titles می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                            font-awesome.css


طراح: Stefan Göllner – June 17, 2013                                      نوشته شده با: (HTML / CSS (SCSS

دمو و کد

درباره کد

این طرح به نام Social media icon reveal with transition. می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari

جزئیات:                            font-awesome.css


طراح: Charlotte Dann – August 5, 2012                                      نوشته شده با: (HTML / CSS (SCSS

دمو و کد

درباره کد

این طرح به نام SOCIAL FLIP CARDS – Messing around with 3d transforms and delayed transitions  می باشد.

مرورگرهای سازگار:               Chrome, Edge, Firefox, Opera, Safari