The 50 Best Free Icon Fonts for UI Design

文章推薦指數: 80 %
投票人數:10人

We have a collection of the best @font-face icon fonts that you can freely download and use in your next mobile app or web design projects. Home Browse Searchthissite SearchOurTwitterPageOurFacebookPageRSSFeed ContentbyCategory BootstrapFramework CSS DesignTrends Fonts FreelanceDesign GeneralDesign Icons DesignInspiration JavaScript LogoDesign MotionDesign Photography PrintDesign UIDesign UXDesign WebDesign WordPress WordPressPlugins WordPressThemes ContentbyApplication AdobeAfterEffects AdobeIllustrator AdobeInDesign AdobeLightroom AdobePhotoshop AdobePremierePro AdobeXD AppleKeynote AppleMotion Figma FinalCutPro MicrosoftPowerpoint Procreate SketchApp Download10FreeDesignTemplatesFromAdobeStockDownloadNow The50BestFreeIconFontsforUIDesign ByPaulAndrewonFeb9th,2022 Fonts&Icons&UIDesign Althoughverypopular,Iconfontsdoalsohavetheirpitfalls.IanFeatherhasdiscussedhisreasonsforswitchingfromaniconfonttoSVG,andCSSTrickshaveoutlinedsomeconsiderationswhenchoosingbetweenaniconfontsystemorSVG. BothclearlyfavorSVG.Asacounter-argument,Pictonichassaidthaticonfontsare10%fasterthanSVG.Thesearejustthingsyoushouldconsiderbeforeyoudouseiconfonts. Toensurethatyouriconsalwaysloadproperlyandhavereliablefallbacksforbrowsersthatdon’tsupport@fontface,youshouldtakealookattheguidelinesset-outbytheFilamentGroup,BulletproofAccessibleIconFonts. MoreFreeIconSets FreeIconSetsforWebDesigners FreeIconFontsforUIDesign FreeSocialMediaIconSets FreeCountryFlagIconSets FreePaymentMethodIconSets FreeGestureIconSetsforAppDesigners TheIcon&UIDesignerToolbox UnlimitedDownloads:1,000,000+IconSets,UIKits,WireframeTemplates,Themes,Plugins,andmuchmore! MagiconsIcons IconSets WebDevelopmentIcons IconSets WebDesign&DevSet IconSets Explore21,000+IconSets EvaIconsOpenSourceUIIconSet(480Icons) Ifyou’redesigninganewinterfaceoryouwanttoshowcaseyourproduct’sfeatures,checkoutthisgreat(andfree)iconfont.Theseopen-sourceiconsfeatureactionsanditems,fromarrowsandattachmentstocolorpalettes.Withover480icons,it’sthewholepackage! TrendyThinLineIconFont(100Icons,EnvatoElements) There’snothinglikeminimalismtohighlightyourproduct’squality,andthisiconsetisanexcellentchoiceforyournextproject.They’revectorsandfullyeditableinAdobeIllustrator.Fromfrequencyiconstobeautifuloutlinetoggleicons,you’llhaveeverythingyouneed! OpenIconicOpenSourceSet(223Icons) Stopworryingaboutmakingyouriconsworkwithyourtextformatting.Thisopen-sourceiconsetcomeswithover230practicalandtechnicaliconsindifferentformats,fromSVGtoWOFF.YoucanquicklysizethemtofityourneedswithCSS,andthey’reperfectlylegibleevenat8px. PictypoIconFontbyTypogama(EnvatoElements) Pictypooffersfunandengagingiconsrenderedwithdingbatfonts.Theroundedstyleaddsadashoffriendliness,andyou’llgetplentytoworkwith.Fromweathericonstoofficesymbols,Pictypoofferseverythingyouneed.Thelinesarebold,sotheylookgoodonlargedisplays,too. IoniconsIconPackforIonicFramework(1,100+Icons) Ioniconsisawell-roundediconpackfortheIonicframework.Youwillgetnumerousappicons(notifications,arrows,food,andmore),aswellasiconsfeaturingrenownedbrands’logos(e.g.,Pinterest).Dependingonyourneeds,youcandownloadoutline,filled,and/orsharpiconrendersasSVGandwebfontfiles. IcoframeWireframeIconSet(60Icons,EnvatoElements) MakeyournextprojectmoredynamicandengagingwithIcoframe–beautifulandmodernwireframeicons.You’llget60minimalistwireframeicons,fromsymbolsforloginpagestogrid,timeline,andtypographyicons.Thedesignisveryintuitive,andyoucaneasilycustomizetheminAdobeIllustrator. FontAwesome(1,500+Icons) FontAwesomeisamassiveandverypopulariconset.Theyofferover1,600freeicons,allofwhichhavebeenmeticulouslydesignedtoshowcasefriendlinessandeaseofuse.You’llfindeverythingfromAWSandotherbrandlogostobusinessandlifestyleiconsintheFAgallery. WirebetWireframeFonts(EnvatoElements) Wirebetfontsareagreatchoiceifyouwanttostreamlineyourworkflowandintegrateengagingiconsintoyourmaterialswithoutbootingupyourdesignsuite.You’llgetvarioustechnicalicons,fromsymbolsforportfoliopagestoarrowsanddeviceicons.Wirebetisperfectforwireframes! LineAwesomeIconFont(1,380Icons) AddmodernlineiconstoyourmaterialsinonelineofcodewithLineAwesome.ItimprovesuponFontAwesome’sofferandletsyouaddallsortsoficons(fromaccessibilityandbuildingtoarrowsandbrandicons)toyourwebsite(viaCDN),Figmaprototypes,andmuchmore. TheCraftyFontCollection(24Fonts,EnvatoElements) TheCraftyCollectionoffers24engagingandfunfontsthatyoucanusetomakeyournextdesignalotmoreexciting.Fromstarsandstripestoroughoutlinesandsprinkles,TheCraftyCollectionoffersfontcombinationsthatplaywelltogethersoyourdesignswillalwayslookcohesiveandinteresting. Dashicons,theWordPressAdminIconFont(300Icons) DashiconsisaniconfontforWordPress.IfyouwanttoemulatethesignatureWPstyleinotherprojects,you’llloveit.It’sverytechnicalinstyle,butitgetsthepointacrossandiseasytouse.FrombrandlogostoTinyMCE,runwild! RemixIconOpenSourceLibrary(2,000+Icons) RemixIconisanopen-sourceiconlibrarywithover2,200icons.Alloftheiconsarefreeforbothpersonalandcommercialuse.You’llseeawidevarietyoficons,fromthinoutlineiconstofilledsymbolsforextraemphasis.GetthemasPNG,SVG,orcode. ThemifyIconFont(320Icons) InspiredbyAppleiOS,Themifyiconsofferover300beautifulminimalisticons.Fromarrowstoappicons,you’llgeteverythingyouneedaseitheraniconfontforeasierworkflowintegration(SVGincluded),orapluginforWordPress.ThemifyiconsareperfectformodernUIdesign! DripiconsLine-IconFontv.2(200Icons) Ifyoudon’twantgarden-varietylineicons,checkoutDripicons.Thisfreeiconfontisincrediblyeasytouse,butthebestpartisthatthey’rebeautiful!You’llgetasetofversatileboldlineicons,fromarrowsandtechtoeducationandmusic. GitHub’sOcticonsIcons(180Icons) IfyoulikeGitHub’saesthetic,you’regoingtolovetheirOcticons.Theseiconsareavailableintwosizes(16pxand24px),andtheyalsoincludesomespecial-caseiconslikepullrequests.Youcantogglebetweenoutlineandfilledicons,andtheyworkperfectlywithdifferentprogramminglanguages. FoundationIconFonts(280Icons) GetgoingwithjustafewlinesofcodeandFoundationicons.Thiscollectioncomprisesdifferentsets,fromgeneraliconstoaccessibilityicons,sothere’ssomethingforeveryproject.Foundationiconsworkasawebfont,soyoudon’thavetojumpthroughhoops. DeviconsIconicFontforDevelopers(78Icons) Deviconsisaniconfontmadespecificallyfordevelopersandawidevarietyofprojects.Thefontcontains85icons,mainlybrandlogosforserviceslikeDropboxandcodingplatformslikePostgreSQL.Deviconscanbeintegratedbyaddingasinglelineofcodeintotheproject’sheaderHTML. TheElegantIconFont(360Icons) Beautiful,elegant,andengaging–thisiconfontcontainsover300diverseicons.They’resimpletointegrateanduse,especiallyifyou’veusedElegantThemesortheDivibuilderinthepast.Fromfileiconstoarrows,youwillfindeverythingyouneedinthisset. FeatherOpenSourceIconSet(282Icons) KeepitsimpleandaccessiblewithFeather,avastcollectionofopen-sourceicons.Fromarrowsandchevrons,toappUIicons,Featherisanexcellentadditiontoyourstandarddesigntoolbox.Youcancustomizethesize,strokewidth,andcolorofeveryicon,sotheyfityourbrandingperfectly. TypiconsIconFont(336Icons) Simple,friendly,andperfectforawidevarietyofprojects,Typiconsareagreatchoice.Theyareembeddedinawebfont,sothey’reeasytouse.You’llget336icons,fromcogsandarrowstobrandlogos.Youcanpickbetweenfillediconsoroutlines. IcoMoon’sFreeIconPack(490Icons) FreshenupyourstandardicontoolkitwithIcoMoon’sfreeicons.You’llget490vectoriconsthatareperfectforappandwebUI.Theseiconsaresimpleandminimalistwithabitofpersonality.Fromhomeiconstosmileyfaces,it’sthewholepackage! GenericonsNeueIconFont(100Icons) SimplifyyourdesignwithGenericons,asetofsimpleandminimalisticonsforwebandappdesign.Theyworkperfectlyforblogsorsimplewebsiteswhereyouwanttokeepthefocusonyourmessaging.You’llgetplentyoficonsforkeyfeatures,fromsitemapstoRSSfeeds. Icon-WorksFreeIconFont(136Icons) Afreeandstylishiconfont,Icon-Worksisanexcellentchoiceifyouwanttomakeyournextdesignstandout.You’llgetplentyofbeautiful,retina-readyiconsthatyoucancustomize.They’rescalable,soyoudon’tevenhavetoworryaboutre-sizingthem. MicronsIconFont(108Icons) Micronsiconstakeprideintheirsimplicity.Thecollectionprovidesiconsforthemostcommonusecases,fromchartsandarrowstonavigationicons.They’reeasytoencode,andthefileitselfisonly5kb,sothey’reperfectforuseacrossyourprojectportfolio. Stroke7IconFont(202Icons) StraightoutofthePixedenworkshop,Stroke7isacollectionofthin-lineicons.Thesetoffers200+iconsthatcanbecustomizedwithCSS.Theywereinspiredbytheearly00icons,sothey’renotgoingtostandoutanddrawattentionawayfromyourmainmessage. StrokeIconFontVol.1(80Icons) PetrasNargeladesignedasetof80strokeicons,andit’sfree.Thesebeautifuliconsarefresh,clean,andreadytospiceupyourdesigns.YoucandownloadthemasPSD,AI,orwebfontfiles.Ifyou’reneedsomethingdifferent,you’vefoundit! MaterialDesignIconicFont CreatedbyGoogle,theMaterialDesigniconsetcontainsplentyoficonsyoucanuseacrossyourprojects.Youjusthavetoaddonelineofcodetoyourwebsite,andyou’regoodtogo!Sincecommunitymembersconstantlyaddtheirownicons,there’splentyofvariety. MinimalOutlineEssentialIcons(77Icons) IfyourUIisminimalist,chooseiconsthatfollowthesameaestheticcues.Thisminimaloutlineiconsetcontainsover70cleanandsharpicons.Thevectorsarescalable,andyoucaneasilychangetheicons’colorstofityourstyle.Youcandownloadthemfreeinvariousformats. ToniconsOutlineIcons(300Icons) Toniconsisafantasticsetoficonfontsthatarenotjusteasytousebutbeautiful,too!You’llget300cleanandminimalistoutlineiconsforappandwebUIdesign.Fromallkindsoffilestomessagingicons,theToniconssetcoverseverysingleusecase. MetrizeMetro-StyleIcons(300Icons) Metrizeiconsbringyou300metro-styleiconsthatwillboostyournextproject.Youcanusethemforappsandwebsites,andit’sallveryeasysincethey’realsoavailableasawebfont.Frombrandlogostoarrows,Metrizehasgotyoucovered! CSSansProCSSFont CSSansisacolorfulanddynamicCSSfont.Composedofmultiplecolorfulgeometricelementsthataddvibrancytoyourdesigns,CSSansisallaboutpersonality!You’llgetuniqueuppercaseandlowercasecharacters,numerals,andothersymbols.It’sinfinitelycustomizableandgrabsattentionfromtheget-go! MFGLabsIconSet(120Icons) MFGLabsiconsetwasoriginallydesignedforaninternalproject,buttheteamcouldn’tresistsharingthisversatileiconset.They’reeasilyembeddableandcustomizablewithCSS.You’llfindalltheiconsyouneedtocreatetherightatmosphereforyournextdesign. LigatureSymbolsIconFont(240Icons) LigatureSymbolsisaniconfontwithfunandminimalisticons.Individualiconscanbecombinedtocreateligatures(e.g.,combinetableandcelliconstocreategrids),improvingthiscollection’susability.You’llfindeverythingyouneed,sogivethisfreeiconfontago! Devicon2.0Programming&DevelopmentIconFont(78Icons) Deviconsarefriendly,dev-friendlyiconscreatedtorepresentprogramminganddevelopmenttools.FromChromeandConfluencetoDjangoandAdobeIllustrator,you’llfindtheiconyou’vebeenlookingfor.Youcaneasilycopy-pastethemintoyourprojectsbyusingeitherthefontversionsorSVGversions. MiniIconFontSet(80Icons) Simpleandclean,theseminiiconsareperfectforawidevarietyofprojects,particularlythosemoreformalintone.Thisiconcollectioncontains80preciselymadeiconsinbothPSDandiconfontformats.Fromdownload/uploadsymbolstolocationandweathericons,thissetofferseveryiconyouneed! HeliumIconSet&Font(100Icons) TarasShypka’sHeliumiconsetoffersplentyoficons.Notonlydotheycomeineveryformatimaginable,butyoucanalsousethemasaniconfont.You’llget112iconswithfine-shadedlinesthataddgloss.Heliumisdefinitelyanaesthete’schoice! Gonzocons2.0LineIcons(100Icons) TheGonzoconssetdesignedbyJanRajtoraloffers100lineiconsthatperfectlyreplicatemodernicondesigntrends.Fromsimplisticarrowstobuoyantheartsandhourglasses,Gonzoconsiconsdefinitelyhaveapersonality.YoucangetthemasSVGfilesorasawebfontforeasierintegrationwithyourapp/site. MapIconMarkerFont(180Icons) MapIconsisaniconfontmadeforGoogleMapsandPlaces.YoucaneasilycustomizetheiconswithCSS,andpickfromover175icons.Fromgeneraliconsforhairsalonstoiconsforactivities,thissetgivesyouplentytochoosefromtomakeyournextprojectamazing. OutlinedIconsWebfont(150Icons) Simpleandfun,thissetoffers150outlinedicons.YoucangetthemasPSD,AI,SVG,orwebfontfiles.DarioFerrando’siconsareinspiredbycontemporarywebicondesign,buttheyhaveplentyofpersonalitytomakeyournextprojectstandoutandwowyouraudience. InfinitySpaceIcons(230Icons) Shootforthemoonwiththesebeautifulspaceicons.You’llgetover230symbols,includingspaceships,planets,andmore!They’reveryeasytouseasthey’readingbatfont,andifyoustarttypingthenumbers,you’llfindtheentiresolarsystem. WeatherThemedIconFont(222Icons) Ifaccurateforecastsareanimperativeforyournextproject,you’lllovethissetofweather-themedicons.Withover200icons(includingspecialtyiconslike28lunarphases),you’llbereadytocreatesomethingamazing!YoucaneasilycustomizethemwithCSStofityourneeds. MeteoconsWeatherIconFont(40Icons) Get40+minimalistandfriendlyweathericonswithMeteocons.Thissetofferseveryformatimaginable,fromSVGtodesktopandwebfonts.They’refreetousepersonallyandcommercially,andyoucanevencreateyourcustomfontwiththeiconsyoufrequentlyuse.Iconupdatesarefreetoo! StackiconsSocialIconFont(75Icons) AddmorecolortoyourdesignswithStackicons,acollectionofover60updatediconsfeaturingbrandlogos,fromDribbbletoReddit.They’lladdmorepersonalitytoyourstandarddesignkit.Youcanchooseregularicons,differentroundedvariations,orsquareicons,andthere’ssomethingforeveryone! SocialiciousSocialMediaIconLibrary(74Icons) Ifyou’reonthehuntforincrediblesocialicons,checkoutSocialicious.Itgivesyousocialmediaiconsinfontform,sothey’reincrediblyeasytouseandeveneasiertocustomize.Integratethemwithasinglelineofcode,andcustomizethemwithCSS. MonoSocialIconsFont(100Icons) Engaginganddynamic,MonoSocialaresocialmediaiconswithafunpersonality.Youcanusethemforfreeandpickoneofthethreepresentationoptions(rounded,circle,regular)tofityourstyle.UsethemwithCSS,HTML,andSCSS.They’refreeforpersonalandcommercialuse. FontfabricSocialMediaIconsPack(74Icons) CreatedbyJelioDimitrov,Socialicoisapackageof74vibrantandengagingsocialmediaicons.They’repackagedasawebfont,soeverycharacteronyourkeyboardgeneratesabeautifuliconwithplentyofpresentationalternates.Sincethesefonticonsarefree,addthemtoyourtoolbox! RelatedPosts The100BestFreeFontsfor2022 30BeautifulFreeSocialMediaIconSets 15FreeGestureIconSetsforMobileAppDesigners 50FreeCleanFontsforYourNextProject Top50FreeIconSetsforWebDesigners Exploringthe10MostPopularGoogleFonts 20BeautifullyDesignedFreeWebFonts 15BestFreeDisneyFontsYouShouldHaveinYourCollection 50FreeFontsforCreatingBeautifulHeadlines&Titles 12FreeDisplayFontswithaCreativeFlair RelatedTags FreeTemplatesIconFontsMonospaceSansSerifSerifWebFonts FreeonEnvatoElements AnkoSerifFontFamily FreeFileDownloadonElements FreeonEnvatoElements VioCreativeWordPressTheme FreeFileDownloadonElements RSSNewsletter SubscribetoourRSSnewsletterandreceiveallofourarticlesdirectlyinyouremailinboxdaily. Subscribe Subscribe Youcanunsusbscribeatanytime. CurrentlyPopular 10FreeResponsiveWebsiteMockupTemplates 15FreeVintage&AntiqueBrushPacksforAdobePhotoshop The20BestGlitchEffectPhotoshopActionSets 10Tools&ResourcesforBuildingaWordPressStagingSite 20FreeRetroFontFamiliesforDesigners TheEasyWaytoHostGoogleFontsLocally 10FreeCollectionsofFeminineLogoTemplatesforDesigners 20IncrediblePhotoshopActionsforSketchingEffects The20BestFreeOutlineFontsforDesigners 15BestFreeDisneyFontsYouShouldHaveinYourCollection HostedbyKinsta



請為這篇文章評分?