Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
<!-- HTML head — fastest loading approach --> <!-- <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Playfair+Display:wght@700&display=swap" rel="stylesheet"> --> /* CSS usage after embedding */ body { font-family: "Inter", sans-serif; font-weight: 400; } h1, h2 { font-family: "Playfair Display", serif; font-weight: 700; } /* Self-hosting alternative with @font-face */ @font-face { font-family: "Inter"; src: url("/fonts/inter-v13-latin-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
Result
Open