Développeur / Encodage

Générateur de Data URI

Transformez n’importe quel fichier en Data URI avec des extraits CSS et HTML prêts à copier, une option encodée en URL plus légère pour les SVG, et le taux d’augmentation du fichier encodé.

Générateur de Data URI: Une Data URI (RFC 2397) place directement le contenu d’un fichier dans un lien ou une feuille de style, ce qui évite une requête distincte. L’encodage Base64 transforme chaque groupe de 3 octets en 4 caractères : les fichiers augmentent donc d’environ un tiers. Comme le SVG est un format texte, il peut être encodé en pourcentage, en échappant uniquement des caractères tels que %, #, < et > ; le résultat est généralement plus léger. Fonctionne 100 % localement dans votre navigateur, sans aucun téléversement de fichier vers le serveur.

Exécutions
Dans votre navigateur
Coût
Gratuit · sans inscription
Disponibilité
Prêt à l'emploi
Générateur d'URI de donnéesTraitement local

Fonctionne entièrement dans votre navigateur

Le fichier est lu dans votre navigateur et n'est jamais envoyé.

Où fonctionnent les URI de données

Les URI de données fonctionnent dans img src, CSS url(), link href pour les icônes et les liens de téléchargement. Les navigateurs empêchent les pages d'ouvrir une URI de données comme page de premier niveau, et une Content Security Policy stricte doit autoriser data: pour les images ou les feuilles de style qui les utilisent.

Pour encoder du texte plutôt que des fichiers, utilisez l'encodeur Base64 ; pour les images avec une chaîne Base64 prête à l'emploi, utilisez l'outil image vers Base64.

Surcoût de taille

Base64 augmente la taille du fichier d'un tiers, mais la compression du texte côté serveur (gzip ou Brotli) en récupère une grande partie, car le texte encodé se compresse bien. Les vrais coûts sont que les données ne peuvent pas être mises en cache séparément et qu'elles sont téléchargées à nouveau avec chaque page ou feuille de style qui les contient.

Comment l'utiliser

  1. Choisissez ou déposez un fichier ; les images sont prévisualisées.
  2. Pour les fichiers SVG, choisissez un encodage URL ou Base64.
  3. Copiez la Data URI ou l’extrait CSS ou HTML.

Confidentialité et limitations

Le fichier est lu dans votre navigateur et n’est jamais téléversé.

Outils associés

Questions fréquentes

Quand utiliser une Data URI ?

Pour les petits fichiers utilisés une seule fois, comme des icônes de quelques kilo-octets. Les fichiers plus volumineux sont mieux servis séparément : le navigateur peut ainsi les mettre en cache et les charger en parallèle.

Pourquoi utiliser l’encodage URL pour un SVG ?

Il conserve la lisibilité du SVG et produit généralement un fichier plus léger que Base64. Les guillemets doubles deviennent des guillemets simples afin que le résultat puisse être placé dans url("…") ou dans un attribut HTML.

Existe-t-il une limite de taille ?

Les navigateurs modernes acceptent des Data URI de plusieurs mégaoctets dans les images et les feuilles de style, mais les grandes URI ralentissent l’analyse et alourdissent les pages.

Outil gratuit · dans votre navigateur exécutions · aucun compte requis