Extremely simple CSS font embedding

get it



You need to become a Contributor to join the discussion - Find out how.
Osman AhmedMaker@leafbomb · Maker for the web
Hi ProductHunt! 👋 SpeedFont is a simple tool that aims to speed up the time it takes to get to the font declaration stage in CSS. The problem with current methods of font embedding in a HTML document is that you are required to both import and declare all desired fonts. They involve unnecessary effort through manually having to find and link to a font path. I tried to fix that by removing the importation of fonts completely out of the process. It is extremely simple to set-up and makes use of open source font libraries. You can declare fonts by name and capitalisation of font names are not required. It is completely free to use and you can send as many requests as you like. I would love to hear your thoughts on it!
Amrith Shanbhag@amrith · Community at Product Hunt & Feathrd
Glad to see so many products coming out of Feathrd 😍 Student makers ftw 🙌🦄 Congrats on the launch @leafbomb, the simplicity in the products you make is just 🔥
Osman AhmedMaker@leafbomb · Maker for the web
@ambonium Thank you Amrith! 😁
Tony Schumacher@tonyschumaker · I love tech, fitness, music & nature
Nice and clean design like always! :)
Osman AhmedMaker@leafbomb · Maker for the web
@tonyschumaker Thank you! 🙌
Adam Revetta@arrev · Founder, CollaborDate & ScareHunt
@leafbomb Very cool, just checked it out. So, if using Google Fonts, I just toss the link rel= into the head, and indicate in my stylesheet which specific classes or tags should use that font. What would that process look like with SpeedFont?
Osman AhmedMaker@leafbomb · Maker for the web
@arrev Hey Adam, So you once you click on "Get Code Snippet", you're provided with a tiny line of code that you have to place before right before your closing 'body' tag. To declare a font, you simply have to name it: h1 {font-family: Anton} or h1 {font-family: Bungee} etc There is no importing or linking to a stylesheet required. With Google Fonts you'd have to manually throw in a link to an external stylesheet and then declare it later on. SpeedFont does all of that for you so you only have to worry about declaring fonts :)
jeremy carson@thejeremycarson · Data-Driven Creative
@leafbomb so rather than google's line of code (linking a sheet) we use your line of code? what's the benefit?
Osman AhmedMaker@leafbomb · Maker for the web
@thejeremycarson See the response I made to Aaron
Paul Finney@paul_finney · Humans + Design + Tech
Love the simplicity of the design! Congrats 🙌🏻
Osman AhmedMaker@leafbomb · Maker for the web
@paul_finney Thanks Paul! 😁