# Overskriftsskrifter som fanger oppmerksomheten

[Canonical HTML page](https://gradiently.design/nb/guide/headline-fonts)

En overskrift har omtrent ett sekund på å bli lest. Skriften gjør overraskende mye av jobben. Her er gratis skrifter som fortjener oppmerksomhet, gruppert etter styrkene sine, med par du kan bruke i dag.

## The short version

- Gode overskriftsskrifter har klare bokstavformer, sterke vekter og nok karakter til å bli gjenkjent med et blikk.
- Smale skrifter som Anton og Bebas Neue gir plass til lange ord i store størrelser, noe som passer til plakater og miniatyrbilder.
- Seriffskrifter med høy kontrast, som Playfair Display og DM Serif Display, gir overskrifter et redaksjonelt, raffinert uttrykk.
- En overskriftsskrift pares vanligvis med en roligere brødtekstskrift, som Inter eller DM Sans, til alt annet.
- Store overskrifter trenger vanligvis litt tettere bokstavavstand og linjeavstand enn standardinnstillingene.

De beste **overskriftsskriftene** kan leses med ett blikk i store størrelser og har et tydelig uttrykk: smale groteskskrifter som Anton eller Bebas Neue til kraft, tunge grotesker som Archivo Black til tyngde, og seriffskrifter med høy kontrast som Playfair Display eller DM Serif Display til eleganse. Alle er gratis på [Google Fonts](https://fonts.google.com). Det riktige valget handler mindre om smak enn om oppgaven: hvor mange ord, hvor mye plass og hvordan overskriften skal føles.

## Dette kjennetegner en god overskriftsskrift

- **Tydelige former med et blikk.** Åpne innvendige rom og klart forskjellige bokstaver gjør ordene lesbare før blikket stanser.
- **God tilgang på vekt.** En familie med bold, extra bold eller black, fordi overskrifter på telefon trenger kraftige streker.
- **God grunnavstand og kerning.** Stor tekst forstørrer alle mellomrom. Gode skrifter trenger mindre justering. Se [kerning](https://gradiently.design/nb/guide/kerning).
- **Et uttrykk som passer budskapet.** Høylytt, rolig, luksuriøst eller teknisk. Skriften sier det før ordene gjør det.
- **Riktig bredde til plassen.** Smale skrifter gir plass til lange ord i smale formater. Brede skrifter passer til korte ord med luft rundt.

## De beste gratis overskriftsskriftene etter stil

| Stil | Google Fonts du kan prøve | Uttrykk | Passer best til |
| --- | --- | --- | --- |
| Smal grotesk | Anton, Bebas Neue, Oswald, Barlow Condensed, Big Shoulders Display | Høylytt, presserende, sportslig | Plakater, miniatyrbilder, salgsinnlegg |
| Tung grotesk | Archivo Black, Inter Tight, Work Sans i black-vekt | Direkte, moderne, rett på sak | Kunngjøringer, produktlanseringer |
| Geometrisk grotesk | Montserrat, Poppins, Outfit, League Spartan | Vennlig, ren, rund | Oppstartsbedrifter, tjenester, sosiale innlegg |
| Grotesk med karakter | Bricolage Grotesque, Space Grotesk, Syne | Særegen, aktuell, litt uvanlig | Merkevarer som vil ha en stemme |
| Seriff med høy kontrast | Playfair Display, DM Serif Display, Instrument Serif | Redaksjonell, raffinert, påkostet | Mote, skjønnhet, tidsskrifter, menyer |
| Myk seriff | Fraunces, Young Serif | Varm, håndlaget, tilgjengelig | Mat, kafeer, uavhengige butikker |

En kortliste å starte med. Alle skriftene her er gratis på Google Fonts med en åpen lisens som tillater kommersiell bruk.

Noen ting er nyttige å vite før du velger. **Bebas Neue** har bare versaler, så den passer til korte, høylytte linjer fremfor setninger. **Oswald** er en nytolkning av den klassiske Alternate Gothic-stilen og finnes i flere vekter, som gjør den mer fleksibel enn Anton. **Fraunces** er en variabel skrift med akser for mykhet og en leken, skjev modus. Én familie kan derfor gå fra skarp til koselig. **Syne** blir merkbart bredere i de tyngre vektene og gir en fet overskrift ekte nærvær.

Et stående salgsinnlegg med SOMMERSALG i store, smale versaler over en klar gradient

Korte, høylytte ord i versaler: uttrykket smale skrifter som Anton og Bebas Neue er laget for.

Et stående redaksjonelt innlegg med en raffinert seriffoverskrift som sier Linets stille tilbakekomst

En redaksjonell overskrift vil ha det motsatte: en seriff med høy kontrast som Playfair Display senker lesetempoet og signaliserer omtanke.

## Slik velger du overskriftsskrift

1. **Skriv den ekte overskriften først** Test med dine egne ord, ikke skriftens eksempeltekst. En skrift som ser flott ut med «Hamburgefonts», kan virke rar med merkevarenavnet ditt.
2. **Mål plassen** En lang overskrift i et smalt format, som en story eller pin, trenger en smal skrift. Korte linjer i brede formater har råd til en bredere.
3. **Tilpass uttrykket til budskapet** Skriv tre ord for hvordan overskriften skal føles. Velg bare skrifter som passer til alle tre.
4. **Test i den minste faktiske størrelsen** Krymp designet til telefonstørrelse eller et miniatyrbilde i et rutenett. Tynne streker og små innvendige rom svikter først.
5. **Par den med en rolig brødtekstskrift** Velg en rolig, lesbar skrift til støttetekst, så overskriften fortsatt er sidens sterkeste element.

## Kombiner overskriftsskrifter med brødtekst

En overskriftsskrift er en spesialist. Den stråler ved 90 px og sliter ut øyet ved 16 px. Par den med en arbeidshest som fungerer i avsnitt og holder seg i bakgrunnen. De tryggeste parene har én tydelig kontrast, vanligvis seriff mot grotesk eller smal mot normal bredde. [Skriftpar](https://gradiently.design/nb/guide/font-pairing) forklarer prinsippene, og [Google Fonts-kombinasjoner](https://gradiently.design/nb/guide/google-fonts-pairings) har mange flere par.

| Overskrift | Brødtekst | Derfor fungerer det |
| --- | --- | --- |
| Anton | Inter | Smal slagkraft over en nøytral, svært lesbar grotesk |
| Playfair Display | Source Sans 3 | Klassisk redaksjonell kontrast mellom seriff og grotesk |
| Bricolage Grotesque | DM Sans | En overskrift med karakter over rolig, geometrisk brødtekst |
| DM Serif Display | DM Sans | Tegnet som par, så proporsjonene stemmer |
| Archivo Black | Archivo | Én familie i to vekter, den enkleste kombinasjonen |
| Fraunces | Manrope | Varm, myk seriff over en ren, moderne grotesk |

Seks par fra gratis Google Fonts. Bruk overskriftsskriften til én eller to linjer, og la brødtekstskriften bære resten.

## Sett overskrifter: størrelse, avstand og linjehøyde

Selv riktig skrift virker svak med standardinnstillinger. Stor tekst trenger tettere bokstav- og linjeavstand enn brødtekst, og færre ord. I praksis betyr det bokstavavstand rundt minus 0,01 til minus 0,03 em og linjehøyde rundt 1,0 til 1,1. På et sosialt innlegg på 1080 px ligger overskriften vanligvis mellom 90 og 140 px. [Skriftstørrelse til Instagram-innlegg](https://gradiently.design/nb/guide/font-size-for-social-media) har hele skalaen.

### Unngå

- Lett vekt til hovedoverskriften på telefon
- Skrive- eller dekorative skrifter til lange overskrifter
- Standard linjehøyde på en overskrift med tre linjer
- To ulike displayskrifter i ett design
- Tolv ord i overskriftsstørrelse

### Gjør dette

- Semibold til black til sosiale medier og miniatyrbilder
- Displayskrift til kraft, grotesk til detaljer
- Linjehøyde rundt 1,05 til stablede linjer
- Én overskriftsskrift brukt konsekvent
- Fem til åtte ord, kutt til det gjør vondt

```html
<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=Anton&family=Inter:wght@400;600&display=swap" rel="stylesheet">

<style>
  h1 {
    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(2.75rem, 7vw, 6rem);
    line-height: 1.02;
    letter-spacing: -0.01em;
  }
  body {
    font-family: "Inter", system-ui, sans-serif;
  }
</style>
```

Last inn et par med overskrifts- og brødtekstskrift fra Google Fonts. Reserveskriftene holder linjebredden omtrent lik mens skriften lastes.

Bakgrunnen betyr også noe. En tung overskrift på en travel gradient kan fortsatt brytes opp der fargen endres bak den. Marker fra Gradiently flytter sitt roligste område bak ordene og velger lys eller mørk tekst linje for linje. Tekstbehandlinger som Kontur, Innlinje og Uttrekk gir dessuten ekstra nærvær uten bokser eller skygger. For stor tekst på plakater, se [displayskrifter](https://gradiently.design/nb/guide/display-fonts) og [fete skrifter](https://gradiently.design/nb/guide/bold-fonts). For miniatyrbilder, se [miniatyrbildetekst](https://gradiently.design/nb/guide/typography-for-thumbnails).

## FAQ

### Hva er den beste skriften til overskrifter?

Det avhenger av oppgaven. Anton eller Bebas Neue passer til korte, høylytte overskrifter. Playfair Display eller DM Serif Display passer til redaksjonelle, og Montserrat eller Outfit til vennlige, rene uttrykk.

### Er Google Fonts gratis til kommersiell bruk?

Skrifter på Google Fonts har åpne lisenser, for det meste SIL Open Font License, som tillater kommersiell bruk. Hver skriftside viser lisensen, så sjekk før du baserer deg på den. [Skriftlisenser](https://gradiently.design/nb/guide/font-licensing) forklarer detaljene.

### Bør overskrifter ha seriffer eller være groteske?

Begge fungerer. Groteskskrifter virker direkte og moderne, seriffskrifter redaksjonelle og raffinerte. Velg etter uttrykket du ønsker, og par med motsatt type til brødtekst.

### Hvor stor bør en overskrift være?

På et sosialt innlegg på 1080 px, rundt 90 til 140 px. På et nettsted, omtrent 2,5 til 4 ganger brødtekststørrelsen, avhengig av den typografiske skalaen.

### Kan jeg bruke to overskriftsskrifter i ett design?

Det er sjelden en god idé. Én displayskrift og én rolig brødtekstskrift gir tydeligere hierarki og et mer gjennomtenkt uttrykk.
