Tag Info

Hot answers tagged

40

I still think that for web, the best free option out there is Liberation Sans. It renders perfectly with @font-face. But you can get Helvetica Neue for web from Fonts.com for web use for a fair price too. I would probably use font-family:"Helvetica Neue, Helvetica, Liberation Sans, Arial, sans-serif"; so those pcs with the font installed can see it, and ...


28

Roboto is a good neo-grotesque sans that can replace Helvetica. Commissioned by Google and released for free. Used as Android's answer to iOS' Helvetica (Neue). More about Roboto's similarity to Helvetica here. It's slightly more humanised I think. I wouldn't overstate its similarity, but I would say it's a good free alternative. I also agree with ...


10

If you really want to use a Google Font, I highly suggest using NUNITO. It has 3 styles: Book, Normal, and Bold. Here is a sample comparison between Book 300 and Avenir: http://joelcrawfordsmith.com/new/font/avenir The sentence length is a perfect match and x-height is great. Its only fault is that the ascenders and descenders are a tiny bit shorter.


9

My solution: SVG sprite sheets with PNG fallback Personally, I think icon fonts are a poor stop gap technology that won't be around in 5 years. SVG images are a far better way to go if you need vectors. SVG has most of the benefits of icon fonts, plus: SVGs can contain colours, gradients and other effects. Works with img tags. Works as CSS ...


9

A search yielded a list of possible alternatives, top of which is Courier. While it may be ubiquitous and not particularly interesting, it's a native font on every [? almost every] OS and present on most systems. Thus it will be rendered well without additional work on your part. The other fonts listed there which satisfy the requirement for slab serifs ...


9

It's legal to ask the browser to use Helvetica Neue if it's available on the system, but you'd need a license if you want to serve the font yourself. One option is to use Helvetica Neue if it's system-installed and fall back to some other sans-serif font like Arial if it's not.


8

The most condensed monospace, open-source font I've found is via fontsquirrel and is called M+ 1m.


7

Windows Metro uses the font Segoe. The font Segoe bears resemblance to the font Frutiger, so in your search for Segoe alternatives you can expand your search to Frutiger alternatives. The font M+ 2p is a free font that's an alternative to Frutiger: It is indeed a strange name for a font, but it is desgined by a foundry called M+. You might also want to ...


7

Tex Gyre Adventor is a really nice replacement for both Avant Garde and Century Gothic. Useful if you also target devices that are not a pc or Mac. It's available as a @font-face kit at FontSquirrel: http://www.fontsquirrel.com/fonts/TeX-Gyre-Adventor


7

I think Museo Sans is good enough: On Google fonts there is also Montserrat could be used for some words :)


7

This font is commercial property and is not allowed to use without proper licensing for usage. Linotype licensing


6

Tex-Gyre-Heros is for me the best one. Enjoy it!


6

I highly doubt this is a font. Each letter is a custom illustration.


6

Nasalization Heavy look close, like Scott said I'm also doubt but i think they used this font for customization.


6

If you're trying to create a 3D ribbon effect, start drawing ;) As others noted, this is custom. The reason you will not find a font (in addition to Microsoft's IP lawyers) is the complex shading. The commonly accepted font formats do not support illustrative gradients and borders. Besides, the effect in the MS example could be greatly improved upon. The ...


6

Is there a recommended way to do this The recommended way is to not do that. The client is hiring the graphic designer for their skills and making decisions like that. If you're just letting the client randomly pick elements of your design, you're not a designer...you're merely an assistant. If you must print out a bunch of fonts, install them all, ...


6

There are actually a handful of different weights for Open Sans. This is most likely the Open Sans Light 300.


6

I want to make sure my design will look on the web exactly as it does in Photoshop or InDesign You can't. The reason is that there is no one 'exact' way your site will work on the web to begin with. Every browser, every operating system, every end-user preferences, every screen, every hardware will bring to the table some variance. This is why so ...


5

The sans-serif font is League Gothic. Here it's overlaid on the image given: The tracking is a bit off but it's clear that the glyphs are a match. As mentioned previously, the other font is Pacifico. Both are freely available for commercial use on Font Squirrel.


5

Typography is rather subjective, so I'm not sure if there's an algorithm for determining a "correct" line-height based on the font-face, font-size, font-weight. It's best practice to make all measurements relative to the font size (em) instead of a fixed value since users can change their default font size on their device. This allows the user to change the ...


5

Open Sans Condensed Multiple weights, and a non-condensed version available as well.


5

One thing to get out there right away: It looks like you want 1) free, 2) multiple weights, and 3) extended character sets. That's a difficult combination. With a lot of these, a combination of 1 and 3 is possible, that usually means you have to pay to get 2. If 1 and 2 are combined, it's often at the expense of 3. Back to your question... Trebuchet is ...


5

Latin Modern Mono is available from FontSquirrel (and also a core font from LaTeX) which is very tight in condensed form. As an additional option, Anka Coder comes in both Condensed and Narrow widths. The Narrow version is one of the other narrowest open-source monospace fonts I have seen. It runs neck and neck with M+1M for width, but with a more ...


5

The font is called Champagne & Limousines: I found this out by mining the source code. With web fonts, you can usually figure it out by inspecting elements or looking at the source.


4

Inkscape certainly converts fonts to paths (Select, then Shift-Ctrl-C). The standard save format is SVG - either 'Inkscape' (extended) SVG or 'plain' SVG. It also has an SVG Font Editor. BTW - I'm assuming this CSS was no good to you: <span style="letter-spacing: 5px">Kerning</span>


4

Try Inkscape - it's an open source alternative to Illustrator. I haven't used it much myself, but it began as an SVG editor, so converting text to paths and saving as SVG should be easy. http://inkscape.org/


4

You could find a font that has a very unique "!" and use the Font Squirrel @font-face generator and choose expert settings with custom subsettings and only include the ! character for the font. Add the font to your stack as the first font and it will only render for the ! For this example I chose Heartbreaker Regular as the font and created an @font-face ...


4

Century Gothic is pretty well-saturated on the Web and has letterforms that are in the same ballpark as Avant Garde. If a Mac doesn't have it on their system, you can put Futura lower down the font stack. Not sure how scientific these surveys are, but the numbers are in line with what I've read before: Century Gothic is on probably about 87% of PCs (63% of ...


4

Try Kern.js. which is based on Lettering.js (both jQuery plugins): http://www.kernjs.com/ http://letteringjs.com/ That would hopefully give you kerning control without sacrificing SEO and accessibility. Update: I just found out about kerning.js, which may offer even more control than Kern.js: http://endtwist.github.com/kerning.js/ Also based on ...


4

There sure is! Just use http://icomoon.io. It's a free webfont creation tool that works with SVG packs, as well.



Only top voted, non community-wiki answers of a minimum length are eligible