Often in web design we are given various media to use across a website by our clients, which can be very useful in determining what direction to take the design in and nailing down the various elements of the website the client wants. This can often include which fonts they want to use.
However, there are times when we are provided a logo or image which employs text with no indication of what font was used to create it, and no access to the original Photoshop layered PSD file. In this instance, there are various online tools we can use to try and determine the font that was used.
Some websites you can use to try and determine a font are:
http://www.myfonts.com/whatthefont
http://www.whatfontis.com
http://www.fontspring.com/matcherator
http://www.identifont.com
Let’s run through the process of trying to determine a font from just a logo. We’ll use the AskOwen logo as our example and we’ll start with the first website.
Firstly, navigate to the MyFonts link provided above and upload your image and click continue.
In this next screen you’ll see that the font tool as tried to decide what is and isn’t a font and then put in the correct letter that matches.
With our AskOwen logo, you can see that the first few squares are picking up the logo itself rather than the text, so you can ignore that. Further down you’ll see the first letters.
If the font tool misses any or gets any wrong, you can alter them here. In our example, there are actually two different fonts, so for our example we are going to concentrate solely on the ‘ASKOWEN’ text.
Once you have made any additions or changes on this page, click to ‘Continue’ to get your results.
As you can see from the results, this particular website has given us some suggestions, but none of them match the actual font in the logo. That’s okay, we can try a different website.
Repeating the process above on the website http://whatfontis.com gave us over 100 results, but in particular this one called ‘Hyundai Normal’ at number 8.
This font looks an almost exact match for our ‘ASKOWEN’ font. Now, as I have access to the original logo’s Photoshop PSD files, I know exactly what the font should be. In the original, it is listed as ‘Die Hund Normal’, however if we compare these two fonts we can see that they are, for all intent and purposes, exactly the same.
So we have successfully identified the font used for ‘ASKOWEN’ even with a slight difference in font name.
Before we wrap this up, let me just mention the website http://identifont.com. This site is slightly different than the others that we used in that rather than uploading an image for it to try and match fonts to, it asks you a series of questions relating to the shape and style of the font you’re looking to try and accurately narrow down exactly what you need. This can be useful if you’re having no luck on other websites, but it can be quite time-consuming so would be a last resort.
In most instances, the designer of the logo may well provide you with the original Photoshop PSD files which will contain all the information you need, however should this information not be available to you, its good to know there are tools out there which can help pinpoint exactly the font being used in any image/logo.