Search

How to Add Fonts for Adobe Photoshop with Typekit

  • Thread starter KodyWallice
  • Start date
KodyWallice

KodyWallice

Member
Joined
May 7, 2021
Messages
123
Reaction Score
1
Points
23
  • #1
I’ve been battling with fonts for decades. Every time I get a new computer, I have to deal with the fact that I’ve got a small handful of horrible fonts installed on it. Back in the day, I had a pretty sweet collection that I used all the time. Today, my go-to font for design is Impact. But as much as I love that font, using it so much gets old and tiresome. If you find yourself feeling like I feel, I’ve got a surprise for you. I’m about to unleash the mother of all font collections upon this website and you’re going to love it. It’s offered by Adobe and it works in conjunction with Photoshop. So if you design with graphics and text inside of Photoshop and have a tough time finding good fonts to use on your machine, read on down below.

Before I begin, I must tell you that this font collection comes standard with a Creative Cloud subscription. I’m not sure if you can access it without that. As far as I know, you will need to be a paying member of any one of Adobe’s subscriptions to access all the wonder of these beautiful fonts.

The service used to be called Typekit, but after Adobe purchased it in 2011, I’m sure they began thinking of what they wanted to change the name to. In 2018, they came up with Adobe Fonts and that’s what it’s called today. The collection boasts over 14,000 fonts, so if you can’t find what you want in there, you may want to reassess some things in your graphics.

Okay, let’s get on with it. Down below, I’ll show you how to access Adobe’s huge font collection right through the Photoshop interface.

To start off with, I’ll create an empty white file and I’ll type Lorem Ipsum in it with any one of the fonts I have already installed on my computer.

lorem-ipsum.jpg

This font happens to be called Arimo. I typed it using the Horizontal Type Tool. At this point, I’m going to go ahead and highlight what I wrote by clicking and dragging over it while still using the same tool.

highlighted-text.jpg

Since I chose such a lousy looking font, I’d like to find a better one to use that’s already installed on my system. To do that, I’ll click on the font drop-down box up in the options bar and then use my up and down arrows to scroll through the installed fonts.

font-drop-down.jpg

This is a pretty good way of doing things if there aren’t too many fonts available. While I don’t have a ton installed, I think this method might become cumbersome though. Especially because I already know that I’d like to use the Impact font, as I mentioned above. I don’t really want to scroll through all of the available fonts.

To find a font that you already know the name of, simply begin typing that name into the drop-down box field. In my case, I got as far as the first two letters and I saw what I wanted.

impact-font.jpg

To choose that font, I’ll simply click on the name of it. My text will immediately change to it.

I’d like to also let you know that you don’t need to necessarily know the exact name of a font to locate similarly styled ones. For example, if I wanted to locate a script styled font, all I would need to do is begin typing in script. Any fonts with the word script in them will appear in that search box. It’s basically a filter, if you will.

script-fonts.jpg

Do you see the two script fonts I have installed in the screenshot above? Yup, that’s all I have.

Since I haven’t found any interesting script fonts available through my computer and since I’d like to use one for this demo, I’m going to go ahead and search Adobe Fonts for one. To do this, I’ll click the Add Fonts From Typekit button that’s located on the right side of the font drop-down. Why they haven’t changed this from Typekit to Adobe Fonts yet is not known at this time. I have no idea.

add-fonts-from-typekit.jpg

After I click on that button, my browser will open up on the Adobe Fonts page and I’ll see lots of different fonts and categories to choose from.

adobe-fonts-webpage.jpg

Since this isn’t a post on how to use the Adobe Fonts website and since it’s updated and changes quite a bit, I’ll leave that to you. Basically, you can filter and search for fonts and font families, and when you find one, as I did by clicking on the Scripts filter button, you can click directly on that font to see more examples of it, if available. In my case, I like the one called Mayence, so I clicked on it for more details.

mayence-font.jpg

Since I’m happy with the Mayence font and since I’d like to use it in my file, I’ll click the Activate Font button that sits to the right of the example text on the Adobe Fonts page. When I do that, a window will appear that tells me what has happened.

font-activation-successful.jpg

That’s all I have to do. Are you ready for the cool part? You’re going to love this.

When I return to Photoshop, I can click the fonts drop-down box again. Since I don’t have that many fonts installed, I’ll see the name of the one I just activated with a small green TK icon next to it.

new-font-activated.jpg

If I’ve got tons of fonts on my machine, I’m not going to want to scroll through all of them. To filter out all of the fonts, other than the ones I activated from Adobe Fonts, I can click the TK icon next to the drop-down.

tk-icon.jpg

Since I only activated one, only one is showing. How neat is that? I can use it just like any other font. Also, I just want to mention that the chosen and activated fonts aren’t actually installed anywhere. They’re simply referenced on the cloud and can be activated and deactivated at any time. This is a huge development that should help bring out the creative side of the least creative of us. Let me know what you think! Thanks for reading!

Here’s the font in action.

mayence-premium-font-example.jpg
 
Top