Fonts Ninja – How to identify website fonts – Firefox and Chrome Browser Extension


so you’re looking for inspiration for
fonts for a new project it might be that you’re redesigning your own website or
you want to use a font for print but you’ve maybe seen it on a website and
you don’t know what it’s called that’s where the web browser plug-in and
application fonts ninja comes it so today I want to show you how to install
it and how it works so the first thing you want to do is you want to go to the
fonts ninja website which is fonts dot ninja really easy to remember once
you’re on that site you then want to go to the products menu and you want to
click on the free browser extension it will give you some information there
about the browser plugin it works on Chrome and Firefox we’ll be using it in
google chrome today and just click on the link there it will take you to the
correct download page for your specific browser you want to then click on add to
Chrome or add to Firefox add extension and you can see now it’s added the fonts
ninja extension to my browser so let’s go to your website and activate that
okay so this is my clients website Gilley’s and makai and let’s pretend
I’ve never been to this website before but I’ve stumbled upon it whilst I’ve
been looking for inspiration for fonts and I’ve decided that actually I like
this font here but I don’t know what it’s called so how do I find out well we
activate fonts ninja so we go up to the extension bar top right and we click on
fonts ninja and what it does is it loads in all of the fonts on that page and
identifies them for us which is really really handy so I can tell now that the
are you ready to start your very own shed life is actually in the font Qin’s
oh you can see here that it says try this font on your computer if you click
on that with the browser extension installed it won’t
actually look like it’s doing anything so what you need to do is you need to
actually install the application from fonts ninja now this application is not
free it’s five dollars a month but by installing the application it opens up
much more functionality to the fonts ninja app and let’s take a look at that
so if we go back to the fonts ninja website and we go to products you’ll see
a link for the fonts ninja application so gives you some information here you
can search for any fonts with more than 3000 fonts they’ve probably got the font
that you’re looking for you can activate a font on your computer to try it
anytime and you can also get the font files downloaded you do need to buy a
license if you want to use those fonts commercially so please be aware of that
downloading through fonts ninja does not give you the license to use that font
it’s only giving you the opportunity to try it out um if you go to the fonts
ninja FAQ page it does tell you here the information that you require about
licensing the fonts that you download using fonts ninja so please check that
out just so that you have Amin nice and legal
so what you do is you click on download fonts ninja and you can install it onto
your computer which I have already done so if we go back to the Gili site and go
here you can see I’ve got fonts ninja now I previously tried these fonts so
what happens is with fonts ninja application installed you can actually
click on the font and you can type in your own text or even text you can
change the tracking and you can change the size
you could also check out some pangrams which use all the letters in the
alphabet with different freezes just so you can see how that text works and then
if you decide yeah I like that and then we can do is you can click on try this
font on your computer it will install it on to your computer so you can see that
jinsol is now showing up in the fonts ninja app I can click on it gives me a
nice big version of it it tells me that it’s activated I can download the font
it’s an open-source Google font so it comes from Google so we can actually use
that one for free commercially which is great if you want to deactivate it just
click on this box here if we go back you’ll see that it’s deactivated and we
can do the same for all of the fonts on this page one last thing you can
actually change the window into dark mode I often prefer this because it’s
easier to see the the white out of a dark background and so you just click on
that little symbol there and that will flick between the two options let’s take
a look at another website another client of mine jami digital let’s activate font
ninja on this website see we’ve got little Oswald Pelletier’s
now the interesting thing here is that Bela TAS is obviously not in the 3000
fonts that are available to fonts ninja the good thing is is that it’s still
identifying the font name so it’s still telling you what it is so you can go and
search on Google if you really want that to go and download it from sites with it
is available but it’s allowing me to download oswald if i want i can click on
oswald type in some text again we can look at pangrams or we can download it and it’s now on my computer and we can
try out and I can try it in Photoshop if I want for any printed materials or for
creating any webpage mock-ups so that’s a really quick overview of fonts ninja
please try it out as I say you don’t have to install the application it does
open up many more abilities to fonts ninja but if you’re just simply looking
to identify fonts but you can then go and find and download yourself then the
browser extension is probably going to be more than enough for you I hope you
find this video useful if you have please remember to give it a like
subscribe to my channel if you haven’t done so already and I do have a monthly
email newsletter now called Rock your brand where I give tips and advice on
brand and design straight to your email inbox you can sign up for that at Rock
your brand code at UK and until I see you next time stay creative folks you

2 Comments

Add a Comment

Your email address will not be published. Required fields are marked *