Générez des images placeholder dans votre navigateur

Générateur d'images placeholder

Créez une image placeholder de n'importe quelle taille avec des couleurs, des styles et un texte personnalisés. Aperçu en direct, téléchargement PNG/JPG/WebP/SVG, ou copie d'une URL de Next BConvert, Lorem Picsum, Placehold.co ou DummyImage avec des extraits prêts à coller.

Des images placeholder pour les mockups, les wireframes et le développement front-end

Créez une image placeholder jusqu'à 4000px par côté avec un fond uni, dégradé ou en damier, et vos propres couleurs et texte. L'aperçu se met à jour instantanément et vous pouvez télécharger des fichiers PNG, JPG, WebP ou SVG, ou copier une URL de Next BConvert, Lorem Picsum, Placehold.co ou DummyImage avec du code prêt à coller.

Comment générer une image placeholder

  1. 1.Saisissez une largeur et une hauteur en pixels, ou choisissez un préréglage comme Avatar, Card, Hero, Twitter Card ou miniature YouTube.
  2. 2.Choisissez un fond uni, dégradé ou en damier, réglez les couleurs et, si vous le souhaitez, saisissez un texte personnalisé — laissez vide pour afficher les dimensions automatiquement.
  3. 3.L'aperçu en direct se met à jour à chaque modification. Rien n'est envoyé : l'image est dessinée localement sur un canvas.
  4. 4.Téléchargez le placeholder en PNG, JPG, WebP ou SVG, ou copiez une URL — Next BConvert, Lorem Picsum, Placehold.co ou DummyImage — avec un extrait HTML, Markdown, JSX, CSS ou BBCode prêt à coller.
  5. 5.Cliquez sur Retina 1×/2×/3× pour télécharger trois copies du même placeholder pour srcset sur les écrans haute densité.

Ce que prend en charge ce générateur de placeholders

Générez des placeholders de 1×1 à 4000×4000 pixels, avec des préréglages en un clic pour les tailles courantes de cartes, héros, réseaux sociaux et appareils.

Choisissez des couleurs unies, des dégradés bicolores ou un fond en damier, avec des couleurs indépendantes pour le fond et le texte.

L'aperçu canvas se redessine à chaque frappe, vous voyez donc le résultat exact avant de télécharger ou de copier quoi que ce soit.

Téléchargez en PNG, JPG, WebP ou SVG, ou copiez l'image en data URL base64.

Générez une URL avec la taille exacte depuis quatre services : Next BConvert la sert depuis votre propre domaine, Lorem Picsum renvoie une vraie photo aléatoire, et Placehold.co ou DummyImage servent des placeholders externes de couleur unie.

Copiez des extraits HTML, Markdown, JSX, CSS ou BBCode prêts à coller qui reprennent les dimensions exactes que vous définissez.

Tout s'exécute dans le navigateur. Votre taille, vos couleurs et votre texte ne quittent jamais votre appareil.

FAQ du générateur d'images placeholder

Quelles tailles puis-je générer ?

N'importe quelle taille de 1×1 à 4000×4000 pixels par côté. Utilisez les champs largeur et hauteur pour des dimensions exactes, ou choisissez un préréglage comme Avatar (200×200), Card (400×300), Hero 16:9 (1920×1080), Twitter Card (1200×630) ou Instagram (1080×1080).

À quoi sert le verrouillage du ratio ?

Activer Verrouiller le ratio maintient le rapport largeur-hauteur fixe : modifiez un côté et l'autre s'ajuste en conséquence. C'est utile pour créer un ensemble responsive du même cadrage, comme des versions 1×, 2× et 3× pour srcset.

Quels styles d'arrière-plan sont disponibles ?

Uni remplit l'image d'une seule couleur. Dégradé mélange les couleurs de fond et secondaire en diagonale. Damier dessine un damier bicolore qui aide à visualiser le rendu de la transparence dans les designs qui superposent l'image.

Puis-je ajouter un texte personnalisé au placeholder ?

Oui. Saisissez jusqu'à 80 caractères et le texte est dessiné centré, en rétrécissant automatiquement pour tenir dans la largeur du placeholder. Laissez le champ vide pour afficher les dimensions (par exemple 600 × 400).

Quels formats puis-je télécharger ?

PNG conserve la transparence, JPG et WebP produisent des fichiers plus légers pour le web, et SVG reste net quelle que soit la taille d'affichage. Vous pouvez aussi copier l'image en data URL base64 pour la coller directement dans du HTML ou du CSS.

Que fait le bouton Retina 1×/2×/3× ?

Il télécharge trois copies PNG du placeholder actuel aux échelles 1×, 2× et 3×, nommées par exemple placeholder-600x400.png et placeholder-600x400@2x.png, prêtes à utiliser dans srcset pour les écrans haute densité.

Quelle est la différence entre Next BConvert, Lorem Picsum, Placehold.co et DummyImage ?

Next BConvert sert le placeholder depuis le point d'accès /api/placeholder de nextbconvert.com, donc il correspond exactement à l'aperçu et reste sur votre propre domaine. Lorem Picsum renvoie une vraie photographie aléatoire aux dimensions demandées, idéale pour des mockups réalistes. Placehold.co et DummyImage servent des rectangles externes de couleur unie avec les dimensions imprimées au centre, adaptés aux wireframes. Choisissez selon l'endroit où l'image sera utilisée.

Mes données de placeholder sont-elles envoyées quelque part ?

Non. L'image est entièrement dessinée dans votre navigateur sur un canvas. Il n'y a pas d'étape d'envoi, et votre taille, vos couleurs et votre texte ne sont transmis à aucun serveur.