text-shadow hackery

Shot_1295051071

4 Responses

  1. Alex Pankratov Alex Pankratov

    Top line is a rendering of Georgia in Firefox on Windows.

    Bottom line adds

    text-shadow: 0px 0px 0px #777;
    text-shadow: 0px 0px 1px #ddd;

    to mask rasterization artifacts (as those in "e", "x" and "s") and make it look smoother and a bit more substantial in general. I think the difference is pretty obvious.

    over 3 years ago

  2. Matt Kump? Matt Kump?

    Nice one! Is it still an improvement in IE9 or Chrome?

    over 3 years ago

  3. Alex Pankratov Alex Pankratov

    An older version of Chrome I have installed distorts lettershapes if there is a 1px+ text-shadow. Just mangles them even if the shadow is fully transparent, so this trick doesn't improve the text appearance.

    IE9 does not support text-shadow (surprise!), but it comes with a new font rendering engine, so fonts may not need any visual tweaks to begin with.

    over 3 years ago

  4. Matt Kump? Matt Kump?

    lol, right, classic IE.

    so a FF specific style would be good if you're picky about font rendering at this level. nice.

    over 3 years ago

keyboard shortcuts: previous shot next shot L or F like