Minimizing Content Shift with font-display in CSS

Reduce layout shifts due to font loading by using font-display in your @font-face rule.

Source Code

@font-face {
    font-family: 'MyFont';
    src: url('myfont.woff2') format('woff2');
    font-display: swap; /* Fallback text is immediately shown with default font */
}