Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for professional graphic designers and non-designers trying to do their own graphic design. It's 100% free, no registration required.

I'm trying to figure out how to reproduce the exact typeface of a font being displayed on my web site in order to use it as a typeface for a logo in Adobe Illustrator.

The text is AJ Acevedo in the header of http://ajacevedo.com. Which appears to be an italic and bold version of 'Lucida Grande'. At least on a mac using Safari.

The problem is that a bold/italic version of 'Lucida Grande' does not exist. A close comparison reveals that the browser is not falling back to the 'Lucida Sans Demibold Italic'.

Here is the css for the .site-title

.site-title {  
    font-family:"Lucida Grande", "Lucida Sans Demibold Italic", "Lucida Sans Unicode", "Lucida Sans", sans-serif;  
    font-weight: bold;  
    font-style: italic;  
    text-decoration: none;  
}

The question is: How do I reproduce the typeface that the browser is displaying for .site-title in a native OS app like Illustrator?

NOTE: If you do not have 'Lucida Grande' installed, your browser will fall back to 'Lucida Sans Demibold Italic'.

share|improve this question
add comment

1 Answer

up vote 2 down vote accepted

It's possible that your browser is applying faux-bold and faux-italic styles to your text. I can only make assumptions without testing it, but I'd guess that your broswer is using Lucida Grande yet it is skewing and fattening the glyphs since there is no bold or italic versions available.

If you want to produce a vector version of this faux bolded and italicized font, you can use a PDF printer to print the page and the text should be saved as outlines. I used Acrobat as a PDF printer. My browser falls back to use Lucida Sans Demibold Italic, but for illustration purposes here is the resulting page outlines (printed from Chrome, viewed in Illustrator):

Illustrator Screenshot

You can grab your vector logo from there.

AJ Acededo

share|improve this answer
    
My answer is a bit of a shot in the dark, it's difficult for me to verify that this will work for your situation. Hopefully it does, though. –  JohnB Dec 26 '13 at 22:26
    
I agree. After some poking with developer tools, Chrome on my Mac is using Lucida Grande and applying a faux italics via CSS. It's not bold in any way, faux or otherwise. –  Scott Dec 26 '13 at 22:42
    
The elephant in the room here is that you should not use a faux rendering of bold, italic or small capitals as the basis for a logo, or for anything. –  TehMacDawg Dec 27 '13 at 22:04
    
Thanks! This answer helped! –  AJ. Jan 1 at 19:48
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.