40 Creative Uses Of Cufón Font Replacement

Cufón has been growing in popularity among designers as an alternative to sIFR. I have personally used it on a couple website designs for clients now, and I have to say, it’s a great tool to add creativity to your website without cluttering it with a huge amount of image tags.

I went through the interwebs and scoured for hours upon hours (ok, maybe just 2) to find a showcase of some of the creative uses of the Cufón font replacement in action. Below are those websites. If you know of one (or you own one), feel free to drop a comment and let us know. :)

The Visual Click ↓

The Visual Click

Press 75 ↓

Press 75

Newlife Uniting ↓

Newlife Uniting

IceArt ↓

IceArt

International Rugby Association ↓

International Rugby Association

Phoenix Web Design ↓

Phoenix Web Design

St. Andrews Presbyterian Church ↓

St Andrews

Rock Beats Paper ↓

Rock Beats Paper

Mochi Media ↓

Mochi Media

Pixel PR Studio Reklamy ↓

Pixel PR Studio Reklamy

ROCK.CZ ↓

Rock

Momentify ↓

Momentify

Localti.me ↓

Localti.me

Healthy Valdosta ↓

Healthy Valdosta

Don’t Talk To Robots ↓

dont talk to robots

Sage Blue ↓

Sage Blue

Camtessa ↓

Camtessa

You Know Who ↓

You Know Who

Pixel Hype Design ↓

Pixel Hype Design

Shopify ↓

Shopify

Primer Presents ↓

Primer Presents

Chantyce ↓

Chantyce

PSD2eCommerce ↓

PSD2eCommerce

Strip Turnout ↓

Strip Turnout

Zendesk ↓

Zendesk

Yellow Bird Project ↓

Yellow Bird Project

Mana Music ↓

Mana Music

Rut Med Flera ↓

Rut Med Flera

Ugmonk ↓

Ugmonk

34One Design Studio ↓

34One Design Studio

Meinl Percussion ↓

Meinl Percussion

Copimaj Interactive ↓

Copimaj Interactive

Adlucent ↓

adlucent

CGInspired ↓

CGInspired

Zero One Hundred ↓

Zero One Hundred

Logobay ↓

Logobay

Corking Design ↓

Corking Design

Gaby Castellanos ↓

Gaby Castellanos

Wrangler Face Off ↓

Wrangler Face Off

Festival Boreal ↓

Festival Boreal

Your Turn To Talk

Again, like I said at the beginning of the article, drop us comments and let us know what sites you liked best and if there are any we missed. Also, feel free to let us know what kind of round-up we should focus on next. If there’s something you’d like to see more of, let us know :)

Comments

  1. says

    I was working on a Joomla website for TradePoint that needed the headers in a different font. I found something about Cufon and could implement it within an hour or so. And not slow at all. Works great for me!
    Nice list by the way!

  2. says

    That is a good selection of sites using the Cufon replacement method. I’ve used it in a few of my sites and find it to be a great tool and a lot easier to implement than Sifr. I also found it easy to solve any problems I had when using it; there seems to be a fairly extensive user base.

    Thanks for the inspiration!

  3. Owen says

    Momentify (the 12th one) is a template right off Theme Forest…. I don’t see how that qualifies as anything creative…

  4. says

    Having used both sIFR and cufon, I am a big fan of cufon. We do use cufon in a couple of themes of ours, Delirium and Raptor. If you’d have known probably one of them would have made it to the list :) Great selection though. Cheers

  5. says

    cufon is great, but the best technique to do font replacement, that do not rely on javascript neither image replacement, neither flash is using @font-face, it works for IE6+, Firefox 3.5(+), Safari 4(+), and Opera 9+, the only browser that does not work for now is chrome, although i think google will change their beavior quite soon.

  6. says

    I came across my portfolio site in this article, which i found amusing
    Cufon is a brilliant tool ever since i came across it a few months back i don’t think i have made a website since that doesn’t use it.
    There are a couple little bugs which i do hope cufon will fix but its definitely nice to be able to use any font you like.
    Good bye arial

  7. says

    Hi there, nice round up of sites. I’ve been using Cufón in most of my sites since it became available and I’ve definitely found it to be be a much more usable script than SiFR. I’m looking forward to seeing how @fontface works out though. Here’s my own site, which heavily relies on Cufón throughout for its visual style and hierarchy. Let me know what you think… http://okellydesign.com
    Niall

  8. says

    Great article, some brilliant uses of cufon. I’m yet to implement it on any of my sites, but definately look forward to getting it sorted in the near future

  9. Deak says

    Unfortunately, most of these websites are breaking the law and you’re doing your readers a disservice by not pointing that out. The licenses for many of the fonts used in your examples actually prevent the use of something like cufon (which re-constructs the font as JavaScript code). With cufon, someone could just steal the JavaScript code and, thus, the font. Very few fonts — even the ones pre-installed on your system — are legally usable by cufon. Aurulent Sans is a proper open source font (there aren’t many) and could be used. Perhaps Google’s Droid font too, but you’d need to check.

  10. Lance says

    “Unfortunately, most of these websites are breaking the law and you’re doing your readers a disservice by not pointing that out. ”

    Here here.

    As a designer, you should be ashamed of yourself for overtly violating IP law. I counted three illegal uses from firms like Hoefler & Frere-Jones (http://typography.com) which states:

    “the delivery of fonts via @font-face (and therefore cufon) constitutes the illegal distribution of our font software, and we therefore do not permit our fonts to be used in this way.”

  11. says

    @Lance: Thanks for pointing that out. I should clarify that we (myself or SpyreStudios) didn’t design any of the sites showcased inthis post, we basically just showcased them for inspiration. It’s up to the site owners to check the font licenses and EULA before using them fonts.

    Cheers

  12. says

    Seems really silly that Cufon violates the EULA of some foundries. You can restrict it to specified domains, which means it can’t be stolen from your site. At that point, the rendered fonts are basically images which you could have manually exported from Photoshop, so I don’t see what the problem is.

    As web designers, we have to make a lot of difficult choices. You could abandon SEO and just use images for text, or you can abandon nice-looking fonts for the few standard web fonts we have. The type foundries are no help, so we step up and build tools to bridge the gap– sifr, cufon, typekit (and other @font-face services).

    I wish the foundries would give us an acceptable alternative rather than hoarding their precious fonts with such restrictive licenses.

    Anyhow, I wanted to post a shameless plug to my Cufon-powered profile page: http://www.chrisfletcher.net

  13. Lance says

    @Jon: Thanks for addressing that – sorry for the harsh words.

    What might make a good companion or follow up to this article is a nice collection of fonts that are free to use with Cufon or @font-face. Finding good ones, especially ones that are decent replacements for restricted fonts, can be difficult at times. Even better would be any CDNs of fonts (like Google http://code.google.com/webfonts) so you don’t have to slow down your site too much just for a headline.

Trackbacks

  1. 40 Creative Uses Of Cufón Font Replacement…

    Cufón has been growing in popularity among designers as an alternative to sIFR. I have personally used it on a couple website designs for clients now, and I have to say, it’s a great tool to add creativity to your website without cluttering it with a h…

Leave a Reply

Your email address will not be published. Required fields are marked *

* Copy This Password *

* Type Or Paste Password Here *