Skip to content

Alt om WordPress, webutvikling — og mer til

🎨 14 Plassholdertjenester for frontend: hva fungerer i 2026

🎨 14 Plassholdertjenester for frontend: hva fungerer i 2026

Oversiktsillustrasjon av plassholdertjenester for frontend-utvikling

Du bygger et oppsett, limer inn den vanlige plassholder-URL-en, og den vil ikke laste. Nettleseren oversvømmer deg med advarsler om blandet innhold, fanen henger i et halvt minutt. Høres det kjent ut?

Plassholdertjenester fra tidlig 2010-tall dør stille: domener fornyes ikke, TLS-sertifikater utløper, ratebegrensninger struper forespørsler. Å oppdage dette en time før en deadline er overhodet ikke morsomt.

Vi testet manuelt 14 levende verktøy: fra fargede rektangler til KI-generering og deterministiske avatarer. Hver enkelt støtter HTTPS, opprettholder stabil oppetid og svikter deg ikke når backend ikke er klar, men du allerede må vise oppsettet.

💡 Rask oversikt:

  • Typologi: fargede blokker, fotoutfyllere, SVG med Edge-levering, avatarer, enhetsmockuper og KI-generering; det finnes et verktøy for enhver oppgave.
  • Hastighet: placeholders.dev og placeholdr.dev kjører på Cloudflare Workers og serverer innhold fra nærmeste Edge-lokasjon.
  • Sikkerhet: alle 14 tjenestene fungerer over HTTPS. Ingen advarsler om blandet innhold overhodet.
  • Ferdig kode: hver tjeneste gir en URL-mal du kan kopiere og lime inn i <img src> på sekunder.

Utvalgskriterier: hva gjør en tjeneste egnet for fungerende mockuper

Parametrene vi brukte for å evaluere hvert verktøy:

  • Kun HTTPS. Blandet innhold i 2026 er et faresignal. Tjenester uten TLS kom ikke med på listen.
  • CDN** eller Edge-levering.** Global dekning betyr lav latenstid fra alle lokasjoner.
  • Aktivt vedlikehold. Ferske commits eller oppdateringer i løpet av det siste året.
  • Forutsigbar URL-syntaks. Mønsteret bør være åpenbart ved første øyekast, uten å lese dokumentasjon.
  • Moderne formater. WebP, AVIF, SVG; uten dem kan en tjeneste ikke konkurrere.

Sammenligningstabell

Behov

Beste valg

Format

CDN

Fargede blokker med tekst

Placehold.co

SVG, WebP, PNG

Ja

Fotoutfyllere for mockuper

Lorem Picsum

JPEG, WebP

Ja

Spesifikke størrelser og forhåndsinnstillinger

DummyImage

PNG, JPEG, GIF

Nei

Hastighet og skarphet

placeholders.dev

SVG

Edge

Brukeravatarer

DiceBear

SVG

Ja

Avatarer med initialer

UI Avatars

PNG, SVG

Ja

Enhetsmockuper

Placeit

PNG, JPEG

Ja

Tematiserte plassholdere

ASSETS.SO

JPEG, PNG

Ja

KI-bildegenerering

placeholdr.dev

JPEG, WebP

Edge

1. Placehold.co: gullstandarden for fargede blokker

Skjermbilde av Placehold.co-tjenesten med fargede blokker

Ankom for å erstatte den upålitelige via.placeholder.com og ble standardvalget. HEX-farger, Google Fonts, størrelse: alt ligger i URL-en. SVG, WebP, PNG. Mønsteret er åpenbart ved første øyekast: /600x400/EEE/31343C?text=Hero+Image.

Fordeler:

  • SVG, WebP, PNG: tre formater i én tjeneste.
  • HEX-farger og Google Fonts rett i spørrestrengen.
  • Stabilt CDN med minimal latenstid.

Ulemper:

  • Kun fargede blokker. Tjenesten genererer ikke bilder.
1<img src="https://placehold.co/600x400" alt="Placeholder">
2<img src="https://placehold.co/600x400/EEE/31343C?text=Hero+Image" alt="Hero">
3<img src="https://placehold.co/600x400.webp" alt="WebP format">

🔗 Placehold.co

2. Lorem Picsum: fotoutfyllere for realistiske mockuper

Skjermbilde av Lorem Picsum-tjenesten med eksempelbilder for prototyper

«Lorem Ipsum, men for bilder.» Leverer ekte bilder fra sin database, perfekt når fargede firkanter ser malplasserte ut. Parameteren seed låser et bilde, uvurderlig for UI-testing.

Filtre (grayscale, blur) gir fleksibilitet. Ingen kreditering påkrevd.

Fordeler:

  • Kvalitetsbilder for mockuper, ikke lagerbildesøppel.
  • Slørings- og gråtonefiltre.
  • seed for repeterbarhet på hver forespørsel.

Ulemper:

  • Ingen presis kontroll over bildeinnhold. Du får det som havnet i bildet.
1<img src="https://picsum.photos/800/600" alt="Random photo">
2<img src="https://picsum.photos/seed/product/400/300" alt="Fixed photo">
3<img src="https://picsum.photos/800/600?grayscale&blur=2" alt="Filtered">

🔗 Lorem Picsum

3. DummyImage: forhåndsinnstillinger for enhver oppgave

Skjermbilde av DummyImage-tjenesten med størrelsesforhåndsinnstillinger

Tjenesten med den mest omfattende tilpasningen for tekstplassholdere. Hovedfunksjonen er dusinvis av forhåndsinnstillinger: annonseformater (Leaderboard, Wide Skyscraper), sideforhold (16:9, 4:3), populære oppløsninger. Bakgrunns- og tekstfarger via HEX, formatene PNG, JPEG, GIF.

Ingen CDN, så hastigheten avhenger av geografi. Ikke kritisk for lokal utvikling.

Fordeler:

  • Dusinvis av forhåndsinnstillinger for annonser, skjermer og standardoppsett.
  • Full kontroll over bakgrunns- og tekstfarge.

Ulemper:

  • Ingen CDN. Forsinkelsen er merkbar fra Australia eller Japan.
1<img src="https://dummyimage.com/728x90/000/fff" alt="Leaderboard ad">
2<img src="https://dummyimage.com/16:9x1080" alt="HD ratio">

🔗 DummyImage

4. Placeholders.dev: SVG fra Edge-servere

Skjermbilde av placeholders.dev-tjenesten med SVG-plassholder

Kjører på Cloudflare Workers og leverer SVG fra Edge-servere. «Superrask» er ikke markedsføringsspråk: levering fra nærmeste Cloudflare-lokasjon betyr ensifret millisekundforsinkelse. SVG gir perfekt skarphet på Retina i enhver skala.

Fordeler:

  • Generering i sanntid via Cloudflare Workers.
  • Skarphet på alle skjermer takket være SVG.
  • Edge-levering fra nærmeste nettverkslokasjon.

Ulemper:

  • Kun SVG. Rasterformater støttes ikke.
1<img src="https://images.placeholders.dev/?width=400&height=300&bgColor=%23f0f0f0&textColor=%23333" alt="SVG placeholder">

🔗 placeholders.dev

5. DiceBear: deterministiske avatarer

Skjermbilde av DiceBear-tjenesten med samling av avatarstiler

Genererer avatarer etter prinsippet «ett frø, ett resultat». Send en e-post eller et brukernavn og få samme avatar ved hver forespørsel. Uvurderlig for brukerlister og admin-paneler: innhold ser befolket ut uten bryet med ekte bilder.

Mer enn tjue stiler, fra pikselkunst til realistiske ansikter. Alt i SVG. API-et er åpent.

Fordeler:

  • To dusin avatarstiler.
  • Deterministisk generering: frø garanterer repeterbarhet.
  • SVG for perfekt skalering.

Ulemper:

  • Kun SVG. For rasteravatarer trenger du en ekstra konverterer.
1<img src="https://api.dicebear.com/9.x/avataaars/[email protected]" alt="User avatar">

🔗 DiceBear

6. UI Avatars: initialer i stedet for bilder

Skjermbilde av UI Avatars-tjenesten med eksempler på initialavatarer

Genererer avatarer med brukerinitialer på farget bakgrunn. Perfekt for kommentarer, chatter og admin-paneler der bilder ikke er nødvendig, men ansiktsløse grå sirkler er irriterende. Størrelse, skrifttype, bakgrunnsfarge og tekstfarge kan alle konfigureres via URL-parametere.

Tjenesten er helt åpen: kildekode på GitHub, du kan spinne opp din egen instans på 10 minutter. Et betydelig pluss for prosjekter med personvernkrav.

Fordeler:

  • Initialer i stedet for bilder med umiddelbar lasting.
  • Full kontroll over bakgrunnsfarge, tekstfarge og skrifttype.
  • Åpen kildekode på GitHub.

Ulemper:

  • Kun tekst på farget bakgrunn. Illustrasjoner støttes ikke.
1<img src="https://ui-avatars.com/api/?name=John+Doe&size=128&background=0D8ABC&color=fff" alt="JD Avatar">

🔗 UI Avatars

7. Lorem Flickr: bilder med Creative Commons-lisens

Skjermbilde av Lorem Flickr-tjenesten med et Flickr-bilde

Søker etter Creative Commons-lisensierte bilder på Flickr og serverer dem som plassholdere. Sammenlignet med Lorem Picsum får du flere «ærlige» øyeblikksbilder her og færre oppstilte komposisjoner. Kvaliteten varierer, men for mockups der autentisitet teller, er det et pluss.

Parameteren lock låser bildet. Nøkkelordsøk avgrenser utvalget.

Fordeler:

  • Nøkkelordsøk.
  • lock for bildebestandighet.
  • Creative Commons med transparent lisensiering.

Ulemper:

  • Uforutsigbar kvalitet: fra mesterverk til uskarpt øyeblikksbilde.
1<img src="https://loremflickr.com/1280/720" alt="Flickr Image">

🔗 Lorem Flickr

8. Placeit: profesjonelle enhetsmockups

Skjermbilde av Placeit-plattformen med mockup-maler for enheter

En plattform fra Envato med nesten 3000 mockup-maler: iPhone, Samsung, stasjonære PC-er, bærbare PC-er, nettbrett. Tjenesten er betalt (Envato-abonnement), men for å presentere design for kunder eller i porteføljer leverer den resultater som ikke kan skilles fra studio-rendringer.

Dra-og-slipp: last opp et skjermbilde, velg en enhet, last ned. For kommersielle presentasjoner betaler det seg umiddelbart.

Fordeler:

  • Nesten 3000 enhets- og scenariomaler.
  • Dra-og-slipp-grensesnitt som ikke krever designferdigheter.

Ulemper:

🔗 Placeit

9. ASSETS.SO: temabaserte plassholdere med karakter

Skjermbilde av ASSETS.SO-tjenesten med temabaserte plassholdere

Gir kontekst til en utviklers daglige rutine. Kategorier: spill, filmer, musikk, sport, fottøy. Et filmnettsted med ekte stillbilder ser mer overbevisende ut enn en skisse med fargede firkanter. API-et er enkelt: /game.jpg?w=1280&h=720.

Fordeler:

  • Tematiserte kategorier for ulike nisjer.
  • Ekstremt enkelt API.

Ulemper:

  • Minimal kontroll over innholdet.
1<img src="https://via.assets.so/game.jpg?w=1280&h=720" alt="Game Asset">

🔗 ASSETS.SO

10. RoboHash: robotavatarer for testdata

Skjermbilde av RoboHash-tjenesten med eksempler på robotavatarer

Genererer unike roboter fra hvilken som helst tekst. Prinsippet er det samme som DiceBear (deterministisk generering), men med karakter: hver robot har sitt eget uttrykk og fargeskjema. Stiler: klassiske roboter, monstre, robotkatter.

Egnet for prototyper der du vil gi testprofiler personlighet.

Fordeler:

  • Deterministisk generering fra tekst.
  • Tre stiler: roboter, monstre, katter.
  • Åpen kildekode.

Ulemper:

  • Kun PNG. SVG støttes ikke.
1<img src="https://robohash.org/[email protected]" alt="Robot avatar">

🔗 RoboHash

11. Bacon Mockup: bacon i alle oppløsninger

Skjermbilde av Bacon Mockup-tjenesten med baconbilde

Deilige baconbilder i alle oppløsninger. For restaurantsider, matblogger eller å tulle med kolleger. Høres ut som en spøk, men tjenesten har vært stabil i flere år.

Høy oppløsning, enkelt API. Nisjepreget, men minneverdig.

Fordeler:

  • Bilder med høy oppløsning.
  • Ekstremt enkelt API.

Ulemper:

  • Smalt tema. Ubrukelig utenfor matprosjekter.
1<img src="https://baconmockup.com/1280/720" alt="Bacon">

🔗 Bacon Mockup

12. Placebeard.it: barskhet i hver piksel

Skjermbilde av Placebeard.it-tjenesten med bilde av en skjeggete mann

Svaret på placekitten, noe mer jordnært og maskulint. Farge- eller svart-hvitt-bilder av skjeggete folk i alle proporsjoner. For barbersalonger, herreklær og hipster-startups. Gråtoner støttes. Tjenesten har kjørt stabilt lenge.

Fordeler:

  • Tematiserte bilder, ideelt for mannlige målgrupper.
  • Støtte for gråtoner.

Ulemper:

  • Smalt tema. Ikke egnet for kvinnelige målgrupper.
1<img src="https://placebeard.it/1280x720" alt="Beard">

🔗 Placebeard.it

13. Placebear: rå naturkraft

Skjermbilde av Placebear-tjenesten med et bjørnebilde

Store, lodne og tidvis farlige plassholdere. Flott for å teste responsivitet på bilder med komplekse teksturer: pels, gress og bark gir rikt materiale for å sjekke komprimering og skalering.

Høyoppløselige bilder, stabil oppetid. Ikke for ethvert prosjekt, men verdt å ha i bokmerkene.

Fordeler:

  • Høyoppløselige bilder.
  • Stabil oppetid.

Ulemper:

  • Spesifikt innhold. Ikke alle kunder setter pris på en bjørn i mockupen sin.
1<img src="https://placebear.com/1280/720" alt="Bear">

🔗 Placebear

14. Placeholdr.dev: AI-genererte plassholdere

Skjermbilde av KI-tjenesten placeholdr.dev med eksempler på bildegenerering

Den ferskeste aktøren i nisjen: AI-generering via Flux-diffusjonsmodell på Cloudflare Workers med R2-caching. Første forespørsel tar flere sekunder å rendere; påfølgende forespørsler serveres umiddelbart fra cache.

URL-format: /{width}x{height}/{prompt}. Stiler: photographic, artistic, anime, oil-painting, 3d-render, cartoon. seed (1-3) låser varianten. Gratis, ingen konto kreves.

Fordeler:

  • AI-generering: naturlig språkbeskrivelser i stedet for HEX-koder.
  • Seks stiler, fra fotorealisme til 3D-rendering.
  • Edge-levering via Cloudflare Workers.

Ulemper:

  • Første forespørsel er treg (flere sekunder å rendere).
  • Ung tjeneste (lansert januar 2026); langsiktig stabilitet er usikker.
1<img src="https://placeholdr.dev/600x400/minimalist modern office" alt="AI-generated office">
2<img src="https://placeholdr.dev/320x320/cat?style=anime" alt="AI anime cat">
3<img src="https://placeholdr.dev/1024x768/camera?style=3d-render&seed=3" alt="AI 3D camera">

🔗 placeholdr.dev

Tekniske hensyn: CSP, offline-modus og hvorfor gamle URL-er dør

Content-Security-Policy-headere

Hvis nettstedet ditt bruker streng CSP, vil eksterne plassholdertjenester blokkeres av nettleseren som standard. Oppdater img-src-direktivet:

1Content-Security-Policy: img-src 'self' https://placehold.co https://picsum.photos;

Viktig: fjern disse domenene fra CSP før du deployer til produksjon. Plassholdere er for utvikling, ikke for live-nettsteder.

Lokal utvikling uten internett

For offline-utvikling eller prosjekter med personvernkrav:

  • Klientsidegenerering av plassholdere via Canvas eller SVG.
  • Lokalt generatorskript i Node.js.
  • Statiske plassholderfiler i repositoriet.

Hvorfor gamle URL-er dør

De fleste tjenestene fra tidlig 2010-tall var sideprosjekter: lansert, vedlikeholdt i et par år, så forlatt. Domenet utløper, sertifikatet foreldes, og URL-en blir til en gresskarpai. Velg tjenester med nylige commits og kommersiell støtte.

⁉️🤔 Ofte stilte spørsmål

Kan jeg bruke plassholdere i produksjon?

Nei. Plassholdertjenester er kun for utvikling og prototyping. Forespørselsgrenser, nedetid, ventetid under belastning. Bytt ut plassholdere med ekte ressurser før lansering.

Hvorfor overlever noen tjenester i årevis mens andre dør i løpet av et par sesonger?

Forskjellen ligger i støttemodellen. Kommersielle eller sponsede tjenester har dedikerte ressurser og mottar stabile oppdateringer. Solo-sideprosjekter drives av entusiasme. Sjekk commit-historikken: hvis den siste var for tre år siden, se etter et alternativ.

Hvordan låser jeg det samme bildet ved hver innlasting?

Bruk seed-parameteren. Lorem Picsum: /seed/product/400/300. DiceBear: [email protected]. RoboHash: hvilken som helst tekst i URL-en. placeholdr.dev: ?seed=1 (tre varianter). Ett seed gir alltid ett resultat.

Må jeg oppdatere CSP for plassholdere?

Ja. Hvis nettstedet ditt har konfigurerte Content-Security-Policy-headere, legg til tjenestedomenene i img-src-direktivet, ellers vil nettleseren blokkere innlasting. Ikke glem å fjerne dem før deployment.

Påvirker eksterne plassholdere hastigheten på lokal utvikling?

Hver <img>-tagg med en ekstern URL gjør en HTTP-forespørsel. Tjenester med CDN og Edge fungerer raskt, men for fullstendig autonomi, ha et sett med statiske plassholdere i repositoriet ditt.

Hvilket format er best for plassholdere?

SVG for geometriske former og tekst: minimal vekt, perfekt skalering. WebP for fotoplassholdere: merkbart lettere enn JPEG ved samme kvalitet. PNG når du trenger gjennomsiktighet. AVIF hvis målgruppens nettlesere støtter det.

Kan jeg bruke bilder fra disse tjenestene i kommersielle mockuper?

De fleste tjenestene tilbyr innhold gratis og uten kreditering. Flickr-baserte tjenester fungerer med Creative Commons; sjekk lisensen for hvert bilde. Placeit krever et Envato-abonnement for nedlastinger uten vannmerke.

Hva du bør bokmerke: den endelige oversikten over plassholdere i 2026

Våre valg for daglig arbeid: Placehold.co for fargede blokker, Lorem Picsum for fotomockuper og DiceBear for avatarer. Disse tre tjenestene dekker det store flertallet av oppgaver.

Trenger du hastighet på Retina? placeholders.dev med Edge SVG. Vil du ha kontekstuelle visuelle elementer uten å søke på bildearkivsider? placeholdr.dev med AI-generering. Forbereder du en kommersiell presentasjon? Placeit med sine tre tusen mockuper.

Hovedregelen forblir den samme: plassholdere lever på utviklingsserveren. Før deployment, bytt ut hver ekstern URL med en ekte ressurs. Ha to eller tre reservetjenester bokmerket; det som fungerte i går kan gå offline i morgen.