Screenshots tonen de Engelse app. Vooraf ingestelde namen en bedieningselementen zijn ook beschikbaar in uw app-taal.

Jouw startpunt

Gebruik Favicon-set in PixRinse en controleer vervolgens deze instellingen ten opzichte van uw werkelijke bestemming.

Instellingen voor deze workflow
Favicon PNG's16 / 32 / 48 px
Apple Raak PNG aan180 px
PNG's van webapps192 / 512 px
KleursRGB
PixRinse Favicon-set voorinstelling met zes PNG websitepictogramgroottes
Instellingen gebruikt voor deze walkthrough. Selecteer de schermafbeelding om deze op volledige grootte te bekijken.
Het PNG-formaat en Converteren naar sRGB worden weergegeven in de coderingsbesturingselementen.
Het PNG-formaat en Converteren naar sRGB worden weergegeven in de coderingsbesturingselementen.

Hoe het te doen

  1. Maak een vierkante bronmarkering

    Gebruik een bron die minstens zo groot is als het grootste pictogram dat je nodig hebt. Vereenvoudig fijne details die kunnen verdwijnen bij 16 px.

  2. Kies Favicon-set

    Bekijk de zes maten. De sjabloon gebruikt een gecentreerde dekkingsregel, dus een niet-vierkante bron kan worden bijgesneden.

  3. Inspecteer de kleinste uitgangen

    Controleer de bestanden 16 en 32 px op ware grootte. Het automatisch aanpassen van de afmetingen kan de opzettelijke optische aanpassingen voor een complex merk niet vervangen.

  4. Exporteer afbeeldingen en voeg hun referenties toe aan uw websitecode

    Voeg de PNG-bestanden toe aan uw website en verwijs naar de relevante formaten in het hoofd- en web-app-manifest van HTML.

DE BESTANDEN UIT DEZE WALKTHROUGH

Wat dit voorbeeld heeft opgeleverd

Een vierkante markering 1024 × 1024 levert zes PNG's op zonder de niet-vierkante bronwaarschuwing. Elk geëxporteerd bestand bevat een sRGB profiel.

Vierkante bron
1024 × 1024
PNG exporteert
6
Kleurprofiel
sRGB op elke uitgang
Werkelijk geëxporteerde bestanden
BestandFormaatPixelsBytes
android-chrome-192x192.pngPNG192 × 19226.980
android-chrome-512x512.pngPNG512 × 512174.868
apple-touch-icon.pngPNG180 × 18023.839
favicon-16x16.pngPNG16 × 16692
favicon-32x32.pngPNG32 × 321.751
favicon-48x48.pngPNG48 × 483.093
Maak een set websitepictogrammen: daadwerkelijk geëxporteerde resultaten
Werkelijke exportresultaten voor de voorbeeldbestanden die in deze walkthrough worden getoond.

Gemeten op de getoonde voorbeeldbestanden. Uw resultaten zijn afhankelijk van uw originelen en instellingen. Deze walkthrough maakt gebruik van eigen PixRinse-illustraties op vierkante of transparante voorbeelddoeken.

Een paar veelgestelde vragen

Creëert het favicon.ico?

Nee. De ingebouwde set exporteert zes PNG bestanden met specifieke bestandsnamen.

Werkt een breed logo?

Een vierkante bron verdient de voorkeur. De omslagregel kan een brede bron bijsnijden, dus bekijk het voorbeeld zorgvuldig.

Zet de workflow aan het werk.

Open PixRinse, voeg een paar afbeeldingen toe en begin met de bovenstaande instellingen.

Download voor MacGratis: maximaal 10 afbeeldingen per batch en één uitvoer per bron. Voor de meerdere uitvoer van deze workflow is Pro vereist. Vergelijk gratis en pro.