Can I make TypeKit fonts work locally?

Question

I have signed up for TypeKit subscription and have added and published a font in my kit and pasted the javascript link in my HTML head.

It asked for my domain name. But is it possible to make it work locally on my computer?

Answer 1

Will answer my own question. Found out on their site

"Using Typekit while developing locally You can specify up to ten domains in your Kit Editor’s Kit Settings, including development domains, subdomains, and “localhost” if you're running a web server on your own machine. Typekit will not work on pages that you open from your file system (file://); this is because Typekit requires a referrer, which a local file system cannot send."

http://help.typekit.com/customer/portal/articles/6857-using-typekit-while-developing-locally

Answer 2

You can use Typekit fonts locally.

I use MAMP (WAMP if you're on Windows) to serve up my development sites locally, which means I can add my localhost domain into the list of URLs in the Typekit "Kit Settings".

Hosting a development site locally is much easier than it sounds, and super useful (and essential for things like Wordpress installs that need a database). MAMP Pro lets you assign as many custom local domains as you like, but the free version does a good job if you only need to develop one site at a time.

Alternatively, if you use Adobe's Creative Cloud service you can download all the Typekit fonts straight to your system and use them in your local development just like you would any other system font. (I haven't tried this approach myself, but using MAMP definitely works. I use Typekit locally every day).

Answer 3

One way to work locally is using virtual hosts. You can have any number of them and bind them all to the same IP address if you wish, by editing your system's "hosts" file. For example:

coolthing.site 127.0.0.1

greatstuff.app 127.0.0.1

anotherone.site 127.0.0.1

If using MAMP (or similar) you might need to operate them on multiple ports (i.e. 80, 8000, 8080, etc).

Then on Typekit you can specify just the one IP address: 127.0.0.1 If necessary include the ports, e.g. 127.0.0.1:8000

---

Alternatively, if you develop with a Vagrant box (or similar virtual machine) -- you can set up your hosts in the vagrant yaml config and it will add them to the hosts file for you. Usually these will be bound to a LAN IP, for example:

coolthing.site 192.168.100.1

greatstuff.app 192.168.100.1

anotherone.site 192.168.100.1

In that situation you would add 192.168.100.1 to Typekit by adding that to the accepted list of domains/IP addresses.