Free online font converter and web font generator

Upload the TTF font file, and the @font-face CSS code will be automatically generated and converted into multiple web font formats for convenient use on web pages

Upload Font File

Click or drag and drop TTF font file here

Supports .ttf format font files, up to 20MB

Generated CSS Code

Add the following CSS code to your stylesheet to use this font on your webpage.

@font-face CSS Code

/* The generated CSS code will be displayed here */

@font-face {
  font-family: 'YourFontName';
  src: url('your-font.woff2') format('woff2'),
       url('your-font.woff') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

Font Format Download

For optimal browser compatibility, it is recommended to download all font format files.

@font-face rules allow you to use custom fonts. Add the generated CSS code to your stylesheet, upload the font files to your server, and then reference this font using the font-family property in CSS.

Usage Steps

Upload your TTF font file (supports drag-and-drop or click to upload)
View the generated @font-face CSS code, click the "Copy Code" button to copy
Download the converted font formats (recommended to download WOFF2 and WOFF formats for optimal browser compatibility)
Upload the font files to your website server and update the URL paths in the CSS code
In CSS, use font-family: 'YourFontName', sans-serif; to apply this font

Why Use Our Font Converter?

Fast Conversion

Convert your fonts in seconds with our optimized processing engine.

Multiple Formats

Generate WOFF, WOFF2, and other web-friendly formats for maximum compatibility.

Easy Integration

Get ready-to-use CSS code that works across all modern browsers.