@font-face Declaration Builder

Compose a CSS @font-face rule from family, weight, style and sources.

Fields

font-family WOFF2 URL WOFF URL (optional) font-weight font-style font-display

@font-face

@font-face {
  font-family: '';
  font-weight: ;
  font-style: normal;
  font-display: swap;
}

About this tool

Generates an @font-face rule with font-display: swap by default. Add multiple source URLs to fall back through formats.