Dezign Matterz » Blog Archive » Best of The Grungy Grunge Fonts

Best of The Grungy Grunge Fonts

Posted on27 Nov 2009

Grunged Out Fonts

Below are some free Grunge Fonts I thought were distinctive and thought some of you may like to use them as well . Of course there are thousands of Grunge Fonts out there I am certain , however I believe these are really awesome if any of you are considering creating a Blog or Website with a Grungy look to it and would like some Font Type inspiration towards your creation . Hope these help

* Please read Authors comments/ stipulations and rules of use prior to download and use of these or any fonts . You will also find some help within trying to install custom fonts on your personal blog / site as well at the end of this post . To download any of the fonts below simply click on the preferred image (font type ) and a new window to the original download site will open . Enjoy !

The Art of Creating Font :

Creating Typography

FONT TYPE : ” CHICKEN HAWK “

by NYMPHONT

FONT TYPE : “FRAIL & BEDAZZLED “

by NYMPHONT

FONT TYPE : “A BITE”

by Billy Argel

FONT TYPE : “SNIPER “

by Billy Argel

FONT TYPE : ” HARD ROCK “

by Last Soundtrack

FONT TYPE : ” CHIC DECAY “

by Last Soundtrack

FONT TYPE : ” GRIDLOCKED “

by The Original 19

FONT TYPE : “INKED GOD “

by Last Soundtrack

FONT TYPE : “L E D LIGHT “

by Billy Argel

FONT TYPE : ” BIRTH of a HERO “

by Last Soundtrack

FONT TYPE : “AMBULANCE SHOTGUN “

by Last Soundtrack

FONT TYPE : “SCUMBAG “

by Disturbed Type

FONT TYPE : ” TABLHOIDE “

by Typo 5

FONT TYPE : ” GRUNGE SANS “

by Shy Foundry

* This Font Type comes in other variations such as :

Regular

Bold (below)

Caps

Italic

Italic-Shadow

Sans -Shadow

FONT TYPE : ” TETANUS “

by Disturbed Type

FONT TYPE : ” NACHOS & T.V. “

by Billy Argel

FONT TYPE : ” JAILBOX 1 “

by Dirt 2

FONT TYPE : ” ALPACA “

by Dirt 2

FONT TYPE : ” RUSTED PLASTIC “

by Last Soundtrack

FONT TYPE : ” TURBO RIPPED “

by Last Soundtrack

Installing Custom Font on Your Blog / Site

There are many users who would like to install custom font on their websites or blogs , either to represent their Websites content , match their header logo or their product . However , what most users may not be aware of is : Their ‘visitor’s ‘ browser may not render that particular font installed due to the fact that many users who will visit your site do not have that particular font installed on their system , and therefore – ‘ your ‘ custom font will display and revert to a browser default font such as : Arial, Georgia, Sans serif , Times, etc .

However , there are ways to go about displaying ” Your Custom Font “ on all browsers by simply embedding it using a Cascading Style Sheet [ CSS ] technique – albeit , this may have some pitfalls.

Your best and safest outlet is to incorporate what is referred to as ” embeddable font ” ( .eot ) , and you will not have to worry about your visitors browser reverting to a default font type – which means : Your custom font will display on all browsers . This will require a bit of effort on your part , but is worth it in the end if displaying custom font is your incentive .

Firstly : Find the custom font you would like to use and make sure that you are allowed to use it by it’s Author ( many font creators stipulate rules for the use of their fonts – so please do respect the Authors wishes when installing any type of font type on your page/web / blog ).
Secondly : You will need to download the preferred custom font ( .ttf ) to your system .
Thirdly : Once you have downloaded the desired font type , you will need to convert it to a ): an .svg file & and b): an .eot file

There are several online generators & ttf to svg & eot converters for this purpose ,however I prefer to use this free .TTF to .SVG CONVERTER ☚ by which to upload .ttf files and once the conversion is complete you will be given the converted .eot , svg files within a matter of seconds ! Also , you will need to upload your .ttf file and convert that to an .eot extension and you can use this free online conversion tool TTF to .EOT CONVERTER☚ .

Once you have converted and DOWNLOADED your .eot & .svg files , you will now need to UPLOAD your 3 file formats to your server or upload host such as dropbox or whatever you are using . Thus , you will upload your .ttf , .eot and .svg files there . Once you have done so , you will need to copy the links to those files and this is where the @font face declaration comes in to save the day .

You can copy the CSS code below , save it and once you have your desired font , along with your converted files you may use it within your own source page , keeping in mind that you will also have to declare the CUSTOM FONT VALUE of your new font everywhere on your source document as well – therefore : wherever you have the font defined : Times, “Arial Bold” , Sans – you will now have to implement your custom font type name within those quotation marks – and you must do this everywhere along your source document in order for your custom font to take effect . Copy the CSS @font face source below & have fun embedding your new custom font on your site .

@font-face {
font-family: ‘YOUR CUSTOM FONT NAME’
src: url(‘http://www.filefactory.com/file/a1a575e/n/YOUR_CUSTOM_FILE.eot’);
src: local(‘YOUR CUSTOM FONT NAME’),
local(‘YOUR CUSTOM FONT NAME’),
url(‘http://www.filefactory.com/file/a1a5755/n/YOUR_CUSTOM_FILE.ttf’) format(
(‘truetype’),
url(‘http://www.filefactory.com/file/a1a61g1/n/YOUR_CUSTOM_FILE.svg’) format(‘svg’);
}

TYPEKIT :

Typekit Fonts

TYPEKIT.COM

Typekit is the easiest way to use real fonts on the web. It’s a subscription-based service for linking to high-quality Open Type fonts from some of the worlds best type foundries. Our fonts are served from a global network on redundant servers, offering bulletproof service and incredible speed. And it couldn’t be easier to use.

So here’s the situation: Every major browser now supports the ability to link to a font. That means you can write a bit of CSS, include a URL to a font file, and have your page display with the typography you expect. For designers and developers, this is a significant step forward. No longer will you need to trap your content in images or Flash just to express yourself visually. Pages will be more usable, accessible, and indexable. This is a massive upgrade for the web.

But there’s a problem. While it’s technically quite easy to link to fonts, it’s legally more nuanced. Almost all fonts are protected by copyright — even those available for free — and very few of them allow for linking via CSS or redistribution on the web. This is understandable; font files represent countless hours of finely detailed labor. Appropriately, type designers are concerned that they’ll lose control of all that hard work.

That’s where Typekit comes in. Typekit has been working with foundries to develop a consistent web-only font linking license. They’ve built a technology platform that lets them host both free and commercial fonts in a way that is incredibly fast, smoothes out differences in how browsers handle type, and offers the level of protection that type designers need without resorting to annoying and ineffective DRM.

As a Typekit user, you’ll have access to our library of high-quality fonts. Just add a line of JavaScript to your markup, tell us what fonts you want to use, and then craft your pages the way you always have. Except now you’ll be able to use real fonts. This really is going to change web design.

Pricing plans are designed to be flexible enough for most designers, developers, and web site owners. Some sites, however, are of a truly massive scale. Just drop a note at enterprise@typekit.com and they’ll walk you through options such as SSL serving, dozens of domain mappings, and scaling to millions or billions of page views.

If you design or distribute fonts, send a note at foundries@typekit.com and they’ll discuss the ways which you can host, distribute, and market your fonts.