# PNG eller JPG: hvilket bildeformat du bør bruke og når

[Canonical HTML page](https://gradiently.design/nb/guide/png-vs-jpeg)

Det ene formatet beholder hver piksel, det andre kaster detaljer for å holde seg lite. Vet du hvilke detaljer som kastes, vet du hvilket du skal velge, hver gang.

## The short version

- PNG er tapsfritt og beholder hver piksel nøyaktig, mens JPG er tapsbasert og fjerner detaljer øyet sannsynligvis ikke legger merke til.
- Bruk PNG til tekst, logoer, skjermbilder, flate farger og alt som trenger gjennomsiktig bakgrunn.
- Bruk JPG til fotografier, der komprimeringen er vanskelig å se og filen blir flere ganger mindre.
- JPG støtter ikke gjennomsiktighet, og det viser lett blokker og striper i myke gradienter og rundt skarpe bokstaver.
- Sosiale plattformer komprimerer alt du laster opp på nytt, så en ren PNG eller en JPG i høy kvalitet gir komprimeringen deres mindre å ødelegge.

Det korte svaret på **PNG eller JPG**: bruk PNG til alt med tekst, logoer, flate farger, skarpe kanter eller gjennomsiktig bakgrunn, og bruk JPG til fotografier. PNG er tapsfritt, så hver piksel du eksporterer, er pikselen som kommer frem. JPG er tapsbasert: det kaster detaljer for å gjøre filen liten, og detaljene det kaster, er nettopp de som gjør bokstaver skarpe og gradienter myke. Et foto skjuler det tapet godt. En overskrift på en gradient gjør det ikke.

## Forskjellen på PNG og JPG

Begge formatene lagrer et rutenett av piksler, så ingen av dem kan skaleres opp uten å bli uskarpe. Det som skiller dem, er hvordan de presser rutenettet inn i en fil.

| Egenskap | PNG | JPG (JPEG) |
| --- | --- | --- |
| Komprimering | Tapsfri: ingenting fjernes | Tapsbasert: detaljer fjernes for å spare plass |
| Gjennomsiktighet | Ja, full alfakanal | Nei, gjennomsiktige områder blir en ensfarget flate |
| Best til | Tekst, logoer, skjermbilder, flate farger, gradienter | Fotografier og fototunge design |
| Filstørrelse | Større for foto, liten for flat grafikk | Liten for foto, justerbar med kvalitet |
| Lagre på nytt | Trygt, ikke noe tap hver gang | Hver lagring taper litt mer |
| Farge | Opptil 16 bit per kanal, sRGB på nettet | 8 bit per kanal, sRGB på nettet |

JPG og JPEG er samme format. Filendelsen på tre bokstaver er en rest fra gamle filsystemer.

JPG deler bildet i små ruter på 8×8 piksler og forenkler fargen og de fine detaljene i hver rute. I et foto fullt av tekstur forsvinner forenklingen i støyen. I en myk gradient eller rundt kanten av en bokstav viser den seg som svake blokker, utsmurte glorier og trappetrinn av farge.

## Når du bør bruke PNG

- **Teksttung grafikk**: sitatkort, kunngjøringer, karuseller, lysbilder.
- **Logoer og ikoner**, særlig på [gjennomsiktig bakgrunn](https://gradiently.design/nb/guide/transparent-background).
- **Skjermbilder** av grensesnitt, der JPG gjør liten tekst uskarp.
- **Gradienter og flate farger**, som får striper og blokker under JPG-komprimering.
- **Masterfiler** du skal redigere igjen, så kvaliteten ikke tapes ved hver lagring.

Et stående innlegg med teksten Åpent lenge på fredager, med skarp skrift over en myk gradient

Et tekstinnlegg på en gradient eksportert som PNG: skarpe bokstaver, ingen striper.

Det samme stående innlegget, brukt til å vise hvor JPEG-feil oppstår rundt bokstaver og i mørke gradientområder

Lagret som en hardt komprimert JPG er det her feilene viser seg først: glorier rundt bokstavene og trinn i de mørke hjørnene.

## Når du bør bruke JPG

Bruk JPG til fotografier: produktbilder, portretter, reise, mat. Ekte foto er fullt av korn og tekstur som skjuler komprimeringen, og en JPG med kvalitet rundt 80 til 85 ser som regel identisk ut med originalen til en brøkdel av størrelsen. Et stort foto i PNG kan lett bli flere ganger tyngre uten synlig gevinst.

JPG passer også til design som stort sett er foto med litt tekst, så lenge teksten er stor. Hvis teksten er liten eller tynn, eller står over en myk himmel, eksporter heller PNG, eller test begge og sammenlign ved 100 % zoom.

## PNG eller JPG til sosiale medier

Instagram, Facebook, X og LinkedIn komprimerer alt du laster opp på nytt, som regel til JPG. Det høres ut som en grunn til ikke å bry seg, men det er motsatt: komprimering hoper seg opp. En JPG som allerede var presset, blir presset igjen, og feilene dobles. Gi plattformen den reneste filen du kan, i nøyaktig den størrelsen den forventer, så den ikke trenger å endre størrelsen. Størrelsene står i [bildestørrelser for sosiale medier](https://gradiently.design/nb/guide/social-media-image-sizes).

- Instagram-innlegg 1080×1350: 1080 × 1350
- Story 1080×1920: 1080 × 1920
- X-innlegg 1600×900: 1600 × 900
- LinkedIn-innlegg 1200×1200: 1200 × 1200

Eksporter i nøyaktig disse pikselstørrelsene. En plattform som må skalere bildet ditt, komprimerer det hardere.

| Det du publiserer | Eksporter som | Hvorfor |
| --- | --- | --- |
| Sitatkort, kunngjøring, karusellbilde | PNG | Skrift og flate farger tåler ny komprimering bedre |
| Gradient- eller materialbakgrunn med ord | PNG | Hindrer striper i de mørke og subtile tonene |
| Fotografi | JPG, kvalitet 85 til 90 | Ser identisk ut, mye mindre |
| Logo til profilbilde | PNG | Rene kanter, og den kan brukes igjen med gjennomsiktighet |
| Open Graph-bilde for lenker | PNG eller JPG | PNG for tekst, JPG for foto; hold det under noen hundre kB |

## PNG eller JPG til en logo

PNG, hver gang, hvis du trenger en pikselfil. En logo består av flate former og harde kanter, som PNG komprimerer godt og JPG ødelegger, og en logo trenger nesten alltid gjennomsiktig bakgrunn så den kan stå på foto, farger og mørk modus. Enda bedre er det å beholde masteren som SVG, som er skarp i alle størrelser. [SVG eller PNG](https://gradiently.design/nb/guide/svg-vs-png) forklarer når du bruker hva, og [logostørrelser](https://gradiently.design/nb/guide/logo-sizes) lister filene du trenger.

## Hvorfor gradienter får striper i JPG

Myke gradienter er den tøffeste testen for ethvert format. En mørk overgang fra nesten svart til dyp fiolett har bare noen få dusin ulike fargeverdier å jobbe med, og JPG-komprimering slår naboer sammen til synlige striper. Det er [stripedannelse i gradienter](https://gradiently.design/nb/guide/gradient-banding), og det er verst på mørke bakgrunner med lav kontrast.

Nesten svart til dyp fiolett: `linear-gradient(180deg, #0b0a14 0%, #1a1233 45%, #2e1a5c 100%)`

En subtil mørk overgang som denne er nettopp det som får striper i JPG. Eksporter den som PNG, eller legg på litt korn før du eksporterer.

### Gir striper

- JPG med kvalitet 60 eller lavere
- Lagre en JPG, redigere den og lagre igjen
- En helt ren digital overgang uten tekstur
- Laste opp en størrelse plattformen må skalere

### Hindrer det

- PNG til alt med gradient
- JPG på 90 eller høyere hvis du må bruke JPG
- Et lett kornlag som bryter opp trinnene
- Eksportere i plattformens nøyaktige pikselstørrelse

Korn hjelper mer enn noen innstilling, fordi det gir komprimeringen tekstur å jobbe med i stedet for en flat rekke nesten like farger. [Kornete gradienter](https://gradiently.design/nb/guide/grainy-gradients) viser hvor mye som er nok. Marks i Gradiently har sitt eget korn og lys, nettopp den teksturen som hjelper et gradientdesign å overleve plattformens nye komprimering.

## Hva med WebP og AVIF

På ditt eget nettsted slår nyere formater begge: WebP og AVIF kan være tapsbaserte eller tapsfrie, støtter gjennomsiktighet og er mindre ved samme kvalitet. Alle dagens nettlesere støtter WebP. Behold PNG og JPG til opplasting på plattformer og deling av filer, og les [WebP eller PNG og JPG](https://gradiently.design/nb/guide/webp-images) før du bygger om bildene på nettstedet ditt. For selve innstillingene, se [bildekomprimering uten å ødelegge gradienter](https://gradiently.design/nb/guide/image-compression).

## FAQ

### Har PNG bedre kvalitet enn JPG?

PNG er tapsfritt, så det mister aldri kvalitet, uansett hvor ofte du lagrer. For fotografier ser en JPG i høy kvalitet lik ut for øyet og er mye mindre, så hva som er best, avhenger av innholdet.

### Bør jeg publisere PNG eller JPG på Instagram?

PNG til tekst, grafikk og gradienter, JPG med kvalitet 85 eller høyere til foto. Instagram komprimerer begge på nytt, så eksporter i nøyaktig den størrelsen den forventer, som 1080×1350 for et stående innlegg.

### Støtter JPG gjennomsiktig bakgrunn?

Nei. JPG har ingen alfakanal, så gjennomsiktige områder fylles med en ensfarget flate, som regel hvit. Bruk PNG, WebP eller SVG for gjennomsiktighet.

### Hvorfor ser gradienten min stripete ut etter at jeg lagret som JPG?

JPG-komprimering slår sammen like farger i myke overganger til synlige striper. Eksporter designet som PNG, øk JPG-kvaliteten til 90 eller mer, eller legg på et lett kornlag.

### Er JPEG det samme som JPG?

Ja. De er samme format; JPG er bare filendelsen i versjonen med tre bokstaver.