Let me know if this sounds familiar. You go online and see a beautiful website with some beautiful fonts, and you want to carry that font over and bring it to your website or your project. But you have no idea what the front is or how to even find out what font that website uses.
Well, if that’s you, you’re in luck. Because in this video, I will show you three different methods of figuring out what fonts a website uses.
How to See What Font a Website Is Using: Method 1
Here’s how you can find out how you can steal your competitor’s fonts.
Go to the browser inspector
My preferred method is always to click the right-click button on my computer. Or if you’re not using a mouse, you can click control and then click.
Ensure the selector is toggled
Click inspect where I clicked. And then, what I want to do is make sure that this little icon right here is checked blue.
Click some text
And then, I’m going to hover over the area where I want to find out what font it is and click on it or hover over it.
Find the font-family
So what we want to focus on is the font family. And there you go. That’s the font that this element is using.
Okay. Now, if you find that a little too complicated and a little too advanced for whatever reason, don’t worry, because there’s a much simpler method to find out what font another website uses.
Method Two
We are going to use a Chrome extension called WhatFont. All you need to do is Google it. You’ll see that I already have it installed, so it won’t let me read or download it. But all you have to do is click on that once you download it, hover over the area, and then click on it, and it’ll tell you right there.
So why don’t we try this method on another website to illustrate this a little further, this is a pretty good one because this is an interesting font. So I want to see what font they’re using. Click on that. Just go ahead and highlight. And there it is. If I click on it, it’ll say PT-Serif; that’s it.
I would recommend clicking on it instead of highlighting it because you might highlight an area that isn’t the font, and you wanted to know what it was.
And it also shows you the size right here. Along with the fallback font. So if PT-serif is unavailable for whatever reason, then Helvetica Neue will be next. So this will tell you a lot. It’s pretty neat.
And one final note, if you don’t see the Chrome extension on your toolbar, go ahead and click this button here and look for it. And it might not be checked. You want to ensure that that pin is checked blue.
Method three
Lastly, we’re going to check out how to take a font you can’t click like a logo and find out what font it’s using. We will be using What the Font.
Now, this might not work in all instances. You might have a funky font that someone wrote by hand or something like that, or it might be just a full-blown logo. So it’s not a font at all. So this may not always work, but it might work for you.
So to use this, we’ll drag an image right into this and I’m going to select that, and let’s see what it says. It found the fonts most similar to the one you uploaded in the image. So that is perfect.
Are you a visual learner? Check out my video below, titled “How to See What Font a Website Is Using (3 Different Methods) Identifying a Webpage’s Typeface,” from my YouTube channel, as I show you all this firsthand.
Frequently asked questions (FAQ)
Do you still have questions? Below are some of the most commonly asked questions about fonts website.
What are fonts and how are they used in design?
Fonts are a set of letters, numbers, and symbols that are designed in a specific style and size. In design, fonts are used to add visual interest and personality to text and can also help to convey a particular tone or message. There are many different types of fonts available, ranging from formal and traditional to modern and playful.
How do I choose the right font for my project?
When choosing a font for your project, consider the purpose of the text, the tone you want to convey, and the audience you are targeting. It’s also important to consider the readability of the font and how it will look at different sizes and on different devices. Experiment with different fonts and try pairing them with different colors and layouts to find the combination that works best for your project.
Can I use any font I want for my project?
Not all fonts can be used freely for any project. Some fonts are licensed for personal use only, while others require a commercial license for use in business or professional projects. It’s important to check the license for any font you want to use to make sure you are using it legally. There are also many free fonts available that can be used for any project without any restrictions.
Conclusion
Okay, so that concludes this article. What do you think? Let me know in the comments below (I read and reply to every comment). If you found this helpful, check out my full blog and subscribe to my YouTube channel. Thanks for reading!