UTILS.
100% in de browser
📱

Web App Manifest-generator (PWA)

Genereer een geldig PWA-webapp-manifest (manifest.json) met iconen, themakleuren en weergavemodus, plus de kant-en-klare link rel=manifest-tag.

— uitvoer verschijnt hier —
— uitvoer verschijnt hier —

Over deze tool

De Web App Manifest-generator bouwt een geldige manifest.json voor een Progressive Web App vanuit een eenvoudig formulier, en geeft je vervolgens de bijbehorende HTML-tags om in de <head> van je pagina te plakken. Alles wordt in je browser samengesteld en er wordt niets geüpload — je kunt de JSON kopiëren, downloaden als manifest.json, of de link- en meta-tags kopiëren.

Een web-app-manifest is het JSON-bestand waarmee een site aan een startscherm kan worden toegevoegd en als een native app kan worden gestart. Deze tool stelt de standaardsleutels samen — name, short_name, description, start_url, scope, display (standalone, fullscreen, minimal-ui of browser), orientation, theme_color, background_color en een icons-array — en laat elk veld dat je leeg laat weg zodat de uitvoer schoon blijft. Elke iconmaat die je aanvinkt wordt een item met zijn src, sizes en type (afgeleid van de bestandsextensie), en de optionele purpose laat je iconen als maskable markeren. Het resultaat wordt geserialiseerd met JSON.stringify op een inspringing van twee spaties, zodat het leesbaar en normconform is.

Gebruik de {size}-plaatshouder in het iconpad (bijvoorbeeld /icons/icon-{size}.png) en deze wordt vervangen door elke afmeting zoals 192x192 en 512x512. Minimaal moet een manifest een name, een start_url, een weergavemodus en minstens een icon van 192px en 512px bevatten, wat hier de standaardwaarden zijn. Verwijs ernaar vanaf je pagina met de gegenereerde <link rel="manifest">-tag en voeg de theme-color-meta toe voor de browser-UI.

Veelgestelde vragen

Wat is een web-app-manifest?
Het is een JSON-bestand dat je Progressive Web App beschrijft — de naam, iconen, kleuren en hoe deze moet starten — zodat browsers kunnen aanbieden om deze aan het startscherm toe te voegen en in een app-achtig venster te openen.
Welke velden zijn verplicht?
Een bruikbaar manifest heeft minstens name (of short_name), een start_url, een weergavemodus en iconen van 192x192 en 512x512 nodig. Deze generator vult die standaard in; andere velden zijn optioneel en worden weggelaten wanneer ze leeg blijven.
Wat betekent 'maskable' voor iconen?
Maskable iconen hebben veilige opvulling zodat platforms ze in cirkels, squircles of afgeronde vierkanten kunnen bijsnijden zonder je logo af te kappen. Stel de purpose in op 'maskable' of 'any maskable' voor iconen die met die veilige zone zijn ontworpen.
Hoe installeer ik het manifest op mijn site?
Sla de JSON op als manifest.json, upload het naar je site, en voeg vervolgens de gegenereerde <link rel="manifest" href="/manifest.json"> en theme-color-metatags toe aan de <head> van elke pagina.

Meer tools