Softonic

Favicon-converter

Maak vanuit één rasterafbeelding de bestanden die nodig zijn om een favicon aan een website toe te voegen. Kies hoe de bron in het vierkante canvas past, stel de achtergrond in en download een ZIP met een ICO in meerdere formaten, zeven PNG-pictogrammen, een webappmanifest, Windows-tegelconfiguratie en een kant-en-klaar HTML-fragment voor de paginakop. De beeldconversie en samenstelling van de ZIP vinden lokaal in je browser plaats.

Een afbeelding omzetten in een faviconpakket

  1. 1

    Kies een rasterafbeelding

    Selecteer een PNG, JPEG of WebP die binnen de getoonde limieten voor bestandsgrootte en afbeeldingsafmetingen valt. SVG-, GIF- en AVIF-bestanden worden niet geaccepteerd.

  2. 2

    Kies de passing

    Gebruik Bedekken om het vierkant te vullen en de randen bij te snijden, of Passend maken om de volledige afbeelding te behouden en ruimte eromheen toe te voegen.

  3. 3

    Stel de achtergrond in

    Kies een achtergrondkleur voor transparante pixels en voor de ruimte die bij Passend maken ontstaat. Controleer daarna de gegenereerde voorbeelden.

  4. 4

    Download en installeer

    Download de ZIP, plaats de pictogram- en configuratiebestanden op je site en kopieer de meegeleverde linktags naar de documentkop.

Inhoud van de ZIP

Onderdeel Doel
favicon.ico Eén ICO-container met versies van 16, 32, 48 en 256 px voor browsers en software die het traditionele faviconpad opvragen
favicon-16x16.png Compacte PNG voor browsertabbladen en andere kleine posities
favicon-32x32.png Pictogram met hogere dichtheid voor browsertabbladen en bladwijzers
favicon-48x48.png Extra formaat voor bureaublad en snelkoppelingen
mstile-150x150.png PNG van 150 × 150 waarnaar de Windows-tegelconfiguratie verwijst
apple-touch-icon.png PNG van 180 × 180 voor koppelingen op het Apple-beginscherm
android-chrome-192x192.png App-pictogram van 192 × 192 waarnaar het webappmanifest verwijst
android-chrome-512x512.png App-pictogram van 512 × 512 waarnaar het webappmanifest verwijst
site.webmanifest JSON-metagegevens die compatibele browsers naar de pictogrammen van 192 en 512 px verwijzen
browserconfig.xml Windows-tegelconfiguratie die naar de gegenereerde pictogrammen verwijst
favicon-head.html Kant-en-klare tags die een pagina koppelen aan de ICO, PNG’s, het Apple-pictogram, het manifest en de browserconfiguratie

De ICO- en PNG-bestanden zijn bewust gescheiden. Browsers en besturingssystemen kiezen pictogrammen op verschillende manieren. Een compleet pakket ondersteunt daarom zowel het traditionele verzoek om /favicon.ico als expliciete moderne pictogramdeclaraties.

HTML-tags voor de paginakop

Het gedownloade pakket bevat een fragment in deze vorm:

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-config" content="/browserconfig.xml">

Staan de bestanden in een submap of op een afzonderlijke assetserver, pas dan de paden aan voordat je de tags in <head> plakt. Zorg dat de bestandsnamen en paden in site.webmanifest en browserconfig.xml overeenkomen met de bestanden die je publiceert.

Bedekken, passend maken en achtergrond

  • Bedekken vult elke vierkante uitvoer volledig. Een brede of hoge bron wordt gelijkmatig vanaf tegenoverliggende randen bijgesneden. Plaats belangrijke elementen daarom dicht bij het midden.
  • Passend maken houdt de hele bron zichtbaar. Ongebruikte ruimte wordt opgevuld met de gekozen achtergrondkleur.
  • Achtergrond kan transparant blijven of een aangepaste effen kleur gebruiken. Bij Passend maken bepaalt deze keuze ook de kleur van de ruimte rond de afbeelding. Controleer de voorbeelden voor publicatie tegen zowel lichte als donkere pagina-achtergronden.

Begin voor de scherpste kleine pictogrammen met een eenvoudige vierkante afbeelding van minstens 512 × 512 pixels. Fijne letters, haarlijnen en kleine details kunnen in de versie van 16 px verdwijnen, zelfs als het bronbestand groot is.

Invoerlimieten en plaatsing

Deze converter accepteert uitsluitend PNG-, JPEG- en WebP-rasterafbeeldingen. Hij controleert de bestandssignatuur en weigert SVG, GIF, AVIF en andere niet-genoemde formaten. Een bronbestand mag maximaal 20 MiB groot zijn, geen zijde mag langer zijn dan 8.192 pixels en de afbeelding mag in totaal niet meer dan 24 megapixels bevatten. De afmetingen worden gecontroleerd voordat de volledige afbeelding wordt gedecodeerd.

Pak na het downloaden de ZIP uit en upload de gegenereerde bestanden naar de paden die in het meegeleverde fragment staan. Paden vanaf de hoofdmap, zoals /favicon.ico, gaan ervan uit dat de bestanden vanuit de hoofdmap van het huidige domein beschikbaar zijn. Wis bij het vervangen van een bestaand favicon zo nodig de site- of CDN-cache, want browsers bewaren pictogrambestanden vaak langer dan gewone pagina-assets.

Het meegeleverde manifest bevat metagegevens voor de pictogrammen, maar alleen een manifest en pictogramset maken een site nog geen installeerbare progressive web app. Installatie hangt ook af van de pagina, beveiligd transport en de eisen van elke browser.

Veelgestelde vragen

Je kunt PNG, JPEG of WebP gebruiken. De converter controleert de bestandssignatuur in plaats van alleen op de bestandsnaam te vertrouwen en weigert SVG, GIF, AVIF en andere formaten.

Bedekken schaalt de afbeelding tot het vierkant vol is en snijdt bij een niet-vierkante verhouding aan de randen gelijke delen af. Passend maken behoudt de hele afbeelding en vult de resterende vierkante ruimte met de gekozen achtergrondkleur.

ICO is een container die meerdere kleine pictogramformaten in één traditioneel faviconbestand kan opslaan. Losse PNG-bestanden bieden browsers en platforms duidelijk bemeten assets voor tabbladen, koppelingen op het beginscherm en app-pictogrammen. Beide behouden geeft in de praktijk een bredere dekking.

Nee. Het manifest beschrijft de gegenereerde app-pictogrammen en bijbehorende weergavemetagegevens. Installeerbaarheid hangt echter af van aanvullende browservereisten en van de manier waarop de site is gebouwd en wordt aangeboden.

Het meegeleverde fragment gebruikt paden vanaf de hoofdmap. De eenvoudigste opzet is daarom om de uitgepakte bestanden in de hoofdmap van het domein te plaatsen. Gebruik je een andere map of assetserver, werk dan het fragment en de paden in het manifest en de browserconfiguratie bij.

Nee. De afbeelding wordt verwerkt en de ZIP wordt gemaakt in je browser. In de meerstapsroute kan een IndexedDB-concept de afbeelding maximaal 30 minuten in deze browser bewaren om deze tussen stappen door te geven. Die lokale overdracht is geen upload naar een server.

Gerelateerde tools

WebP naar PNG

Converteer WebP-afbeeldingen naar PNG met behoud van transparantie en pixelnauwkeurige kwaliteit voor bewerken, afdrukken en oudere ontwerptools.

GIF-maker

Zet een reeks afbeeldingen of een korte video om in een geanimeerde GIF. Stel beeldsnelheid, herhalingen en afmetingen in voor het exporteren.

Barcodegenerator

Maak scanbare 1D-barcodes in Code 128, Code 39, EAN-13, UPC-A, ITF-14 en Codabar. Exporteer als PNG, SVG of PDF voor drukwerk.

Bulk afbeeldingsresizer

Sleep meerdere afbeeldingen naar binnen, pas ze in of rek ze naar een doelgrootte en exporteer JPG, PNG of WebP in één ZIP. De verwerking blijft in je browser.

Foto-editor

Browsergebaseerde foto-editor met bijsnijden, draaien, helderheid, contrast, verzadiging, filters, tekstoverlay en export naar JPG, PNG of WebP.

Comprimeer GIF

Verklein een geanimeerde GIF in je browser door de afmetingen te schalen, minder frames te bewaren en de encodeerkwaliteit aan te passen. Bekijk de lus voor je downloadt.