SpeedFont

Extremely simple CSS font embedding

1 follower

SpeedFont gallery image
SpeedFont gallery image
Launch tags:Web AppProductivityAPI
Launch Team
AppSignal
AppSignal
Built for dev teams, not Fortune 500s.
Promoted

What do you think? …

Amrith
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
@ambonium Thank you Amrith! 😁
Osman
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!
Tony Schumacher
Nice and clean design like always! :)
Osman
@tonyschumaker Thank you! 🙌
Adam
@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
@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
@leafbomb so rather than google's line of code (linking a sheet) we use your line of code? what's the benefit?
Osman
@thejeremycarson See the response I made to Aaron
Aaron Lumsden
Nice and clean design with the site however I can't see or understand how it saves much more time than embedding a google web font. Import the script and then declare it in your stylesheet. They both seem to work the same. Maybe Im missing the point. Well done on launching though :-)
Osman
@aaronlumsden Hey, Thank you! 🙌 One great use case of this would be during the development of a site. For someone who uses a lot of fonts, rather than having to find a path to the font online and create a stylesheet around it, you could simply just declare the font name and SpeedFont will automatically do the importing for you. This also speeds up time when it comes to testing out different fonts on the same element that have not been imported. Once you paste the script in your document, you are free to declare any font you like from a large library :) There's a lot of other fonts here too beyond Google Web Fonts!
Paul Finney
Love the simplicity of the design! Congrats 🙌🏻
Osman
@paul_finney Thanks Paul! 😁
Matt Lippl
@leafbomb great stuff! Would this happen to work in email as well?
Osman
@mattblackpageux Hey I don't think JavaScript can be embedded into emails but would be great otherwise haha