Generateur de Favicon SVG

Transforme un logo SVG ou raster en pack favicon complet avec ICO, variantes PNG, icone Apple Touch et web manifest

Exemples de résultats

2 Exemples

Generer un pack favicon standard depuis un SVG

Cree ICO, PNG, icone Apple Touch, manifest et un extrait HTML pret a coller a partir dun logo vectoriel

svg-favicon-generator-example1.zip Voir fichier
Voir paramètres d'entrée
{ "sourceFile": "/public/samples/svg/01-basic-shapes.svg", "backgroundColor": "#ffffff", "fitMode": "contain", "paddingPercent": 10, "siteName": "Studio Atlas", "themeColor": "#0f172a" }

Construire un jeu d icones d application depuis un logo raster

Utilise le mode cover et un theme sombre pour creer une suite favicon quand la ressource source est en PNG

svg-favicon-generator-example2.zip Voir fichier
Voir paramètres d'entrée
{ "sourceFile": "/public/samples/images/logo.png", "backgroundColor": "#020617", "fitMode": "cover", "paddingPercent": 4, "siteName": "North Grid", "themeColor": "#020617" }

Click to upload file or drag and drop file here

Maximum file size: 20MB Supported formats: image/svg+xml, image/png, image/jpeg, image/webp

0 8 35

Points clés

Catégorie
Images, audio et vidéo
Types d’entrée
file, color, select, range, text
Type de sortie
file
Couverture des échantillons
4
API disponible
Yes

Vue d’ensemble

Le Générateur de Favicon SVG est un outil pratique qui transforme instantanément votre logo vectoriel ou matriciel en un pack complet d'icônes pour le web. En quelques clics, générez les formats indispensables (ICO, PNG, Apple Touch Icon) ainsi que le fichier web manifest et le code HTML prêt à être intégré. Idéal pour garantir une identité visuelle parfaite sur tous les navigateurs et appareils mobiles sans utiliser de logiciel de design complexe.

Quand l’utiliser

  • •Lors du lancement d'un nouveau site web nécessitant des icônes compatibles avec tous les navigateurs modernes et anciens.
  • •Pour créer rapidement une icône Apple Touch et un fichier web manifest (site.webmanifest) pour une Progressive Web App (PWA).
  • •Lorsque vous disposez d'un logo au format SVG, PNG ou JPEG et que vous devez générer automatiquement toutes les tailles de favicon requises.

Comment ça marche

  • •Téléversez votre fichier logo source (SVG, PNG, JPEG ou WebP) dans l'outil.
  • •Ajustez les paramètres visuels tels que la couleur de fond, le mode d'adaptation (contain ou cover) et la marge interne (padding).
  • •Renseignez le nom de votre site et la couleur du thème pour configurer automatiquement le fichier web manifest.
  • •Téléchargez le fichier ZIP généré contenant toutes vos icônes et copiez l'extrait HTML fourni dans la balise <head> de votre site.

Cas d’usage

Création d'un pack d'icônes standardisé pour un blog ou un site vitrine à partir d'un simple logo SVG.
Génération des ressources visuelles (icônes et manifest) nécessaires pour rendre une application web installable (PWA) sur mobile.
Adaptation rapide d'un logo d'entreprise avec un fond coloré spécifique pour correspondre à la charte graphique d'un nouveau projet web.

Exemples

1. Générer un pack favicon standard depuis un SVG

Développeur Web
Contexte
Un développeur intègre un nouveau site web pour Studio Atlas et a besoin des favicons à partir du logo vectoriel fourni par le designer.
Problème
Créer rapidement tous les formats d'icônes requis (ICO, PNG, Apple Touch) sans ouvrir un logiciel de graphisme.
Comment l’utiliser
Téléverser le fichier SVG, définir le mode sur Contain avec 10% de marge, et entrer Studio Atlas comme nom de site.
Configuration d’exemple
Couleur de fond: #ffffff, Mode: contain, Marge: 10%, Nom du site: Studio Atlas, Couleur du thème: #0f172a
Résultat
Un fichier ZIP contenant toutes les icônes parfaitement dimensionnées, le web manifest et le code HTML prêt à être collé dans le <head>.

2. Construire un jeu d'icônes d'application depuis un logo raster

Créateur de PWA
Contexte
Un créateur lance une Progressive Web App nommée North Grid et ne dispose que d'un logo au format PNG.
Problème
Générer des icônes adaptées au mode sombre et un fichier manifest valide pour l'installation sur mobile.
Comment l’utiliser
Importer le logo PNG, choisir le mode Cover avec un fond sombre (#020617), et configurer la couleur du thème.
Configuration d’exemple
Couleur de fond: #020617, Mode: cover, Marge: 4%, Nom du site: North Grid, Couleur du thème: #020617
Résultat
Un pack complet d'icônes sur fond sombre, optimisé pour les écrans mobiles, avec un fichier site.webmanifest correctement configuré.

Tester avec des échantillons

xml, image, png
Exemples SVG
Exemples de graphiques vectoriels évolutifs (SVG) démontrant diverses fonctionnalités et techniques SVG
title token svg
image
Exemples de Traitement d'Images Web Python
Exemples de traitement d'images Web Python utilisant PIL/Pillow incluant la lecture, l'enregistrement, le redimensionnement et la conversion de format
preferred input family image
image
Exemples de Traitement d'Images Android Java
Exemples de traitement d'images Android Java incluant lecture/écriture, mise à l'échelle et conversion de format
preferred input family image
image
Exemples de Traitement d'Images Android Kotlin
Exemples de traitement d'images Android Kotlin incluant lecture/écriture, mise à l'échelle et conversion de format
preferred input family image
image

Hubs associés

Outils de conversion de formats d image et d export anime
Comparez les convertisseurs d image pour JPG, PNG, GIF, AVIF, WebP, TIFF, ICO, base64 et les exports orientes animation dans un meme hub.
Outils de conversion video vers audio et d animation
Comparez les outils qui transforment la video en audio, extraient des flux et convertissent entre video courte et formats d image animes dans un meme hub.
Outils XML de conversion, mapping et XPath
Des outils reunis pour conversion XML, mapping, fusion et extraction XPath dans un seul hub.
Outils de nettoyage, finition et preparation d images en lot
Regroupe dans un meme hub les outils de nettoyage d image, rognage, marge, encadrement, redimensionnement et compression par lot, filigrane et finition visuelle.

FAQ

Quels formats d'image sont acceptés en entrée ?

L'outil accepte les fichiers vectoriels SVG ainsi que les images matricielles aux formats PNG, JPEG et WebP (jusqu'à 20 Mo).

Que contient le fichier ZIP téléchargé ?

Le fichier ZIP inclut un fichier favicon.ico, plusieurs tailles de favicon en PNG, une icône Apple Touch, un fichier site.webmanifest et un extrait de code HTML à intégrer.

À quoi sert le paramètre de marge (padding) ?

La marge permet d'ajouter un espace vide autour de votre logo pour éviter qu'il ne touche les bords de l'icône, garantissant ainsi un meilleur rendu visuel.

Quelle est la différence entre les modes Contain et Cover ?

Le mode Contain ajuste le logo pour qu'il soit entièrement visible dans l'icône, tandis que Cover remplit tout l'espace disponible, quitte à rogner légèrement les bords de l'image.

Comment installer les favicons sur mon site web ?

Extrayez les fichiers du ZIP à la racine de votre site web, puis copiez le code HTML fourni et collez-le dans la section <head> de vos pages HTML.

Documentation de l'API

Point de terminaison de la requête

POST /fr/api/tools/svg-favicon-generator

Paramètres de la requête

Nom du paramètre Type Requis Description
sourceFile file (Téléchargement requis) Oui -
backgroundColor color Non -
fitMode select Non -
paddingPercent range Non -
siteName text Non -
themeColor color Non -

Les paramètres de type fichier doivent être téléchargés d'abord via POST /upload/svg-favicon-generator pour obtenir filePath, puis filePath doit être passé au champ de fichier correspondant.

Format de réponse

{
  "filePath": "/public/processing/randomid.ext",
  "fileName": "output.ext",
  "contentType": "application/octet-stream",
  "size": 1024,
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}
Fichier: Fichier

Documentation de MCP

Ajoutez cet outil à votre configuration de serveur MCP: 

{
  "mcpServers": {
    "elysiatools-svg-favicon-generator": {
      "name": "svg-favicon-generator",
      "description": "Transforme un logo SVG ou raster en pack favicon complet avec ICO, variantes PNG, icone Apple Touch et web manifest",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=svg-favicon-generator",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Vous pouvez chaîner plusieurs outils, par ex.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 outils.

Prend en charge les liens de fichiers URL ou la codification Base64 pour les paramètres de fichier.

Si vous rencontrez des problèmes, veuillez nous contacter à [email protected]