A short time ago I posted “Free web font resources for designers“, which includes a short list, because there are thousands of free web fonts out there, so in today’s post, I am going to highlight several sources of font inspiration, which I have found from film and television. Some of these inspiring fonts are free, and some have a cost structure attached in one form or another. In the second part of this series I will show you how to apply these custom fonts to your websites using the @font-face CSS property.
If you have been following me for sometime now, you might already know that I get inspiration from many atypical sources. One such unusual source of insight comes from films and movies, which for me are a great way that I get my font inspiration. For instance, several nights ago we happened to watch the film, Step Brothers, and I noticed that the opening credit, as shown in Figure A below, utilizes a particular and unique font. So, I did some digging to find out what exactly is the font utilized in the credits and titles for the film. And I also wanted to know if these fonts are available for use in web design, so I embarked on a search.
The “Mrs. Strange“ true type font as displayed in Figure B below, on dafont.com seems to be similar to the one used in the “Step Brothers” film, so I tested it with the custom preview text of “Relativity Media”, to match and compare to the opening sequence. Turns out that it is a close approximation of the font, but it does not exactly match up. So I did some more digging; I even contacted the company that created the titles for the Step Brothers film; but I am still waiting on a reply.
The opening sequence in “Step Brothers” also reminded me of the font used in the title sequences for the Men in Black films, as shown in Figure C below.
The “Men In Black” opening sequence titles were created by the graphic designer, and film title designer Pablo Ferro, who is also credited with creating titles for the films Dr Strangelove, Bullitt, The Thomas Crown Affair, No Way Out, Addams Family, To Die For, Good Will Hunting, LA Confidential, and The Manchurian Candidate. All of these title sequences can be viewed at the Alien Resident Digital Video Effects page. Several of Ferro’s film titles are displayed in the collage shown in Figure D below.
Notice how the film title fonts for Dr. Strangelove, The Addams Family, and Men in Black, have the similarity of long, straight vertical lines. Da Font also has a Men In Black Credits true type font as shown in Figure E below.
Now, we are getting somewhere! However, when downloaded, and tested, the font does not seem to scale well. (I will say more on the quality of free fonts later.) The Men In Black Credits true type font was created by Jens R. Ziehn, and as it turns out, he is also credited with creating eighteen total film-worthy title fonts for web and print usage, including Mars Attacks, Goonies, The Sixth Sense, Signs, and Shaun of The Dead, several of which are displayed in Figure F below.
My original quest to find the source of the Step Brothers title font took me down yet another path, and as it turns out, I am not the only one who has found film and movie title fonts for inspiration. Jay J. Nelson of Macworld posted an article on April 2, 2010 where he describes the inspiration he gets from them as well. Jay’s first inspiration came from watching a segment of the I Dream of Jeannie TV series, and his search for that font pointed him to the Famous Fonts website. I had to check it out for myself. Several of the fonts you can find there are displayed in Figure G.
However, once I checked out the website and then attempted to download several fonts, I received errors that the zip files were unavailable, so there is some hit or miss success with obtaining fonts from this site. Nelson’s inspiration reminded me of similar television shows from the 1960s and 1970s, which got me to thinking about the title font used in the TV series, Gilligan’s Island, as displayed in Figure H below. And, as it turns out, the Gilligan’s Island font by Mark Riddle is available for download on Da Font, as shown in Figure I below. And while the true type Gilligan’s Island font does capture the essence of the original font from the title sequence in the TV series, it does not portray the exact spacing and alignment characteristics, which of course are hard to do when you translate an original free form hand drawn font into a useful and reusable true type font for web or print.
Can you legally use any of these free fonts for commercial use?
Most of the fonts that are provided by Famous Fonts and other online sources such as Da Font are either freeware or shareware, and each is provided from the original source as a zip file for download. Each font listing includes the font name, the original author, and the zip file; some also contain a read me file with licensing and usage instructions.
Quality varies from each original source, and in some cases, you do get what you pay for. Variations in detail, spacing, and certain glitches can prevent them from being useful, in particular when converted for print. As a rule of thumb, you may want to stick with those fonts that the designer has identified with their name and any versioning comments along with the font file, as these are generally a better quality product.
In the next post, I will demonstrate incorporating several of these custom fonts to your websites using the @font-face property in your CSS, allowing visitors to view your nifty fonts no matter the browser or the local- device installed fonts.
Do you have favorite font styles that you’ve picked up from film or TV? Share them with us below.