Vision Font Family

Use "Vision" font as a Webfont

You can create beautiful websites with great typography using the @font-face kit of Vision font. Webfont and @font-face supported all up-to-date browsers can use comfortably.

@font-face is very easy to use, click here to download Vision webfont kit. The following example will guide you to the css and html codes.

Ensuring the maximum cross browser typography support, WOFF (Web OpenFont Format) works with all up-to-date browsers. You can check the versions by clicking here.

Using this font on your website is your own legal responsibility. You can check the license information of the font.

@font-face kit

@font-face {
    font-family: 'Vision Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Regular'), url('Vision.woff') format('woff');
}
@font-face {
    font-family: 'Vision Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Italic'), url('Vision-Regular italic.woff') format('woff');
}
@font-face {
    font-family: 'Vision Thin Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Thin Italic'), url('Vision-Thin italic.woff') format('woff');
}
@font-face {
    font-family: 'Vision Thin';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Thin'), url('Vision-Thin.woff') format('woff');
}
@font-face {
    font-family: 'Vision Light';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Light'), url('Vision-Light.woff') format('woff');
}
@font-face {
    font-family: 'Vision Light Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Light Italic'), url('Vision-LightItalic.woff') format('woff');
}
@font-face {
    font-family: 'Vision Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Bold'), url('Vision-Bold.woff') format('woff');
}
@font-face {
    font-family: 'Vision Bold Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Bold Italic'), url('Vision-BoldItalic.woff') format('woff');
}
@font-face {
    font-family: 'Vision Black Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Black Italic'), url('Vision-Black italic.woff') format('woff');
}
@font-face {
    font-family: 'Vision Heavy';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Heavy'), url('Vision-Heavy.woff') format('woff');
}
@font-face {
    font-family: 'Vision Heavy Italic';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Heavy Italic'), url('Vision-HeavyItalic.woff') format('woff');
}
@font-face {
    font-family: 'Vision Black';
    font-style: normal;
    font-weight: normal;
    src: local('Vision Black'), url('Vision-Black.woff') format('woff');
}

sample html

<h3 style="font-family: 'Vision Regular'">Similique et vel accusantium.</h3>
<h3 style="font-family: 'Vision Italic'">Aut vel veritatis occaecati ducimus ut.</h3>
<h3 style="font-family: 'Vision Thin Italic'">Voluptas id ut qui neque.</h3>
<h3 style="font-family: 'Vision Thin'">Et quae optio distinctio reiciendis et saepe.</h3>
<h3 style="font-family: 'Vision Light'">Illo inventore modi dicta. Qui sed fugit enim et.</h3>
<h3 style="font-family: 'Vision Light Italic'">Rerum aut doloribus in odit libero minus.</h3>
<h3 style="font-family: 'Vision Bold'">Est voluptas rerum et aut aliquid vel nihil.</h3>
<h3 style="font-family: 'Vision Bold Italic'">Qui atque aspernatur soluta sequi quam.</h3>
<h3 style="font-family: 'Vision Black Italic'">Et ad quo provident qui.</h3>
<h3 style="font-family: 'Vision Heavy'">Est eum animi laboriosam quasi provident sunt.</h3>
<h3 style="font-family: 'Vision Heavy Italic'">Iste inventore et iusto sed.</h3>
<h3 style="font-family: 'Vision Black'">Necessitatibus autem sed mollitia placeat quia.</h3>

Preview

License