article:
Typography: QuickHand - Free Hand Written Web Font
article:
Elements Design: Free Kitchen Cooking Vector Set

Typography: BLOKK - better wireframing font

Advertisement

@font-face is a CSS rule which allows you to show a font on a Web page even if that font is not installed on the users' computer. This means that designers and developers can begin moving away from Web-safe fonts that users have pre-installed on their computer such as Arial, Times New Roman, Verdana and Trebuchet.

Using @font-face means we can "do away" with hiding titles and using numerous time-consuming images per title and instead have a single font file on the server. Saving time and bandwidth.


Resource Typography: BLOKK - better wireframing font


BLOKK font gives you a nice fill text for mock-ups and wireframing without the lorem ipsum. The new and better wireframing font.

BLOKK font helps you create good looking mock-ups and wireframes, where layout is more important than latin words.



Implements

CSS
@font-face {
    font-family: 'BLOKKRegular';
    src: url('../font/BLOKKRegular.eot');
    src: url('../font/BLOKKRegular.eot?#iefix') format('embedded-opentype'),
         url('../font/BLOKKRegular.woff') format('woff'),
         url('../font/BLOKKRegular.svg#BLOKKRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'BLOKKNeue-Regular';
    src: url('../font/BLOKKNeue-Regular.eot');
    src: url('../font/BLOKKNeue-Regular.eot?#iefix') format('embedded-opentype'),
         url('../font/BLOKKNeue-Regular.woff') format('woff'),
         url('../font/BLOKKNeue-Regular.svg#BLOKKNeue-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

and
font-family: 'BLOKKRegular';
...
or
...
font-family: 'BLOKKNeue-Regular';


Screenshots

BLOKK Regular
Resource Typography: BLOKK - better wireframing font

BLOKK Neue Regular
Resource Typography: BLOKK - better wireframing font


Hope you’d like it and share your feedback in below comments!

Download it for free, don`t forget to add comments, link-back or screenshot, previews if you use it.




demo blokk regular
demo blokk neue regular
download
source

Advertisement
Tags: blokk wireframe mockup font font-face layout interface web design regulat neue regular

Leave a Comment

No Comment

© Creative3x Ltd.