Wireframes avant assets réels. Exports Storybook/Figma avec placeholders. Tester lazy-loading ou CSS d'aspect-ratio. Remplacer un service externe dans des projets à CSP strict.

SVG n'est pas raster. Pour PNG : capture ou convertisseur. Les longues data URIs sont gênantes dans les outils/diffs — préférer le téléchargement pour de gros mockups. L'étiquette auto n'est pas localisée. Saisir un texte custom si besoin. Couleurs en hex HTML uniquement. Pour rgba() éditer le SVG. La taille est intrinsèque. Mise à l'échelle CSS avec preserveAspectRatio="none" . Ne pas laisser en production.

Générateur d'Image Placeholder

Générez des images SVG placeholder de toute taille avec texte et couleurs personnalisés. Sortie en data URI ou SVG téléchargeable.

Width (px)

Height (px)

Background colour

Text colour

Label text (leave blank for "WxH")

Preview

SVG markup

Data URI

Download

À quoi ça sert ?

En conception de page, on a souvent besoin d'une image d'une taille précise avant l'asset final. Les services comme via.placeholder.com ajoutent une requête externe. Cet outil produit un SVG inline autonome avec la taille et l'étiquette voulues — data URI ou téléchargement. Rien ne quitte le navigateur.

Quand l'utiliser

Wireframes avant assets réels.
Exports Storybook/Figma avec placeholders.
Tester lazy-loading ou CSS d'aspect-ratio.
Remplacer un service externe dans des projets à CSP strict.

Pièges courants

SVG n'est pas raster. Pour PNG : capture ou convertisseur.
Les longues data URIs sont gênantes dans les outils/diffs — préférer le téléchargement pour de gros mockups.
L'étiquette auto n'est pas localisée. Saisir un texte custom si besoin.
Couleurs en hex HTML uniquement. Pour rgba() éditer le SVG.
La taille est intrinsèque. Mise à l'échelle CSS avec preserveAspectRatio="none".
Ne pas laisser en production.