Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS - Custom Fonts?

Tags:

css

fonts

I have a design and Myriad Pro is required. This isn't a problem. The issue is that in Photoshop they have used 'Bold Condensed'. I am not sure what this is called, I think it is one of the varients of Myriad Pro. What is the best way to emulate this on a website?

Thanks.

like image 435
JasonS Avatar asked Aug 24 '10 14:08

JasonS


1 Answers

FontSquirrel is your best resource. Their "@font-face generator" creates code that will work with all the modern browsers.

What they do is well-explained but behind the scenes it's pretty complicated. You can read up on the CSS aspects on Paul Irish's blog.

Edit

I just realized that nobody has answered your real question...

1.) Myriad Pro is a family of fonts, implemented as a collection of files, with names like Myriad Pro.otf, Myriad Pro Bold.otf, and so forth. (The actual names are OS-specific.) Myriad Pro Bold Condensed is one of those files. I don't know if it comes with the standard package or whether it costs extra.

2.) You cannot "emulate" this. You can either use the actual font on your webpage (via the @font-face embedding method described above), or create a graphic. The designers probably expect you to create graphics, because designers [tirade deleted] when it comes to implementation.

3.) As has been pointed out, embedding supposedly requires an appropriate license, and I don't know if you can get such a license for this particular face. ("Supposedly", because [tirade deleted], but I'm not a lawyer.)

like image 79
egrunin Avatar answered Nov 15 '22 13:11

egrunin