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'">Aliquid illum voluptatum dicta iusto rerum id.</h3>
<h3 style="font-family: 'Vision Italic'">Vitae velit ut dolorem.</h3>
<h3 style="font-family: 'Vision Thin Italic'">Expedita dicta velit molestias officiis.</h3>
<h3 style="font-family: 'Vision Thin'">Vitae eum ipsam vel est non.</h3>
<h3 style="font-family: 'Vision Light'">Dolores saepe facilis placeat aliquid.</h3>
<h3 style="font-family: 'Vision Light Italic'">Impedit dicta laboriosam velit.</h3>
<h3 style="font-family: 'Vision Bold'">Velit aut fuga nisi eos eum delectus hic.</h3>
<h3 style="font-family: 'Vision Bold Italic'">Sed est sapiente ea vel sed ea.</h3>
<h3 style="font-family: 'Vision Black Italic'">Est consequatur et possimus.</h3>
<h3 style="font-family: 'Vision Heavy'">Sit ipsum autem accusantium rem expedita.</h3>
<h3 style="font-family: 'Vision Heavy Italic'">Qui officiis vel beatae.</h3>
<h3 style="font-family: 'Vision Black'">Et quo dolores et et exercitationem.</h3>

Preview

License