Free Font Face Generator Websites

Font is the important factor in a website. User interface or user experience deeply related with web font. Font face generator converts the font into @font-face. Font face depends on website type. If you have e-commerce or personal website, then you need to use different type web font face.

The Font Face Generator is an online tool which converts your font in .ttf or. otf file. The font generator is free to use personally or commercially, but most of the font isn't free. The Font Face Generator work in a very simple way. At first you need to upload the font, click the button 'Convert', after processing it will give a .zip file. When you'll extract the ZIP file, you'll get all font formats, CSS and HTML preview file.

In the article I'll show you most popular online free websites, where from you can convert your fonts.

After converting fonts, you can use it easily. You need to write it in your stylesheet with @font-face, see the below example.


@font-face {
font-family:'MyriadPro-Regular';
src: url('fonts/MyriadPro-Regular_gdi.eot');
src: url('fonts/MyriadPro-Regular_gdi.eot?#iefix') format('embedded-opentype'),
url('fonts/MyriadPro-Regular_gdi.woff') format('woff'),
url('fonts/MyriadPro-Regular_gdi.ttf') format('truetype'),
url('fonts/MyriadPro-Regular_gdi.svg#MyriadPro-Regular') format('svg');
font-weight: 400;
font-style: normal;
font-stretch: normal;
unicode-range: U+0020-25CA;
}

When you generate font, you'll get 4 formats (eot, woff, ttf, svg), keep it in 'fonts' folder or any name. Call the folder name in stylesheet file.

Now define it with font-family like as below.


h1{ font-family: "Sri-TSCRegular", serif }

1. Web Font Generator

Most of the time I use Web Font Generator. It's only convert the font with 4 formats. Web site link https://www.web-font-generator.com

2. Font Squirrel

It's a font face generator, but you can get your favorite font from here. Here have many free and paid fonts for professional work. Website link http://www.fontsquirrel.com/tools/webfont-generator

3. Font2web

At present Font2web in beta mode. You can convert any .ttf (TrueType Font) or .otf (OpenType Font) file to .ttf, .otf, .eot, .woff and .svg files from here. Website link http://www.font2web.com

4. Online Font Converter

From Online Font Converter you can generate fort as your own wish font. Like as if you want to generate only .eot and .svg, check mark it and convert. Really enjoyable. Website link https://onlinefontconverter.com

5. Fontie

Fontie is the great online font generator. From Fontie you can also generate Greek, Latin, Arabic font. Here has simple and advanced options for generating font. Official website https://fontie.flowyapps.com/home

6. Everything Fonts

Everything Fonts not only convert the font, but also show you the font browser compatibility, reference, syntax etc. Website link https://everythingfonts.com/font-face

7. Flaticon

Flaticon designed, developed and updating by freepik.com. You can get a lot of vector font, icon font, adobe extension etc. It's totally free for download. Official website http://www.flaticon.com/font-face

If you know about more similar websites for font face generator, don't forget to share with us. Leave a comment, I'll add the website in the next update.

For more Tutorials keep visiting our Blog.

Share it in your Facebook, Twitter, Google Plus wall.

Thanks.


একটি মন্তব্য পোস্ট করুন

নবীনতর পূর্বতন

যোগাযোগ ফর্ম