Générateur de motif de fond SVG
Générez un motif de fond SVG transparent — points, grille, rayures, ondes, carrés, hexagones ou topographie — en tant que SVG, CSS ou classe Tailwind.
Générateur de motif de fond SVG
Choisissez un motif — points, grille, rayures diagonales, ondes, carrés, hexagones ou topographie — et cet outil construit un motif SVG transparent que vous pouvez insérer directement dans le fond d'un site web, dans un écran d'application ou dans une conception imprimée. Le motif est construit à partir d'une seule tuile répétée, donc le fichier reste petit peu importe la taille de la zone qu'il couvre.
La taille de la tuile contrôle l'espacement entre les répétitions, et l'épaisseur de la ligne contrôle la façon dont les traits sont audacieux — elle définit également la taille des points et des carrés pour ces deux motifs. Le premier plan et l'arrière-plan acceptent n'importe quelle couleur hexadécimale (#RRGGBB ou la forme plus courte #RGB), l'opacité estompe le motif dans son arrière-plan sans toucher à la couleur de fond elle-même, et la rotation tourne toute la tuile — les rayures diagonales commencent déjà à 45° et tournent plus loin à partir de là. Changez le format de sortie pour obtenir exactement ce dont vous avez besoin : un balisage SVG brut à enregistrer en tant que fichier, une règle CSS prête à coller avec le motif intégré en tant qu'URI de données, ou une classe de valeur arbitraire Tailwind que vous pouvez insérer directement dans la liste de classes d'un élément.
Chaque option met à jour l'aperçu instantanément au fur et à mesure que vous l'ajustez, et le total sous la sortie indique les dimensions de la tuile, le nombre exact de caractères du code généré et le format de sortie actif. Parce que le motif est une seule petite tuile vectorielle plutôt qu'une image raster, il reste net à n'importe quel niveau de zoom et s'adapte à n'importe quelle taille d'écran gratuitement.
Tout s'exécute localement dans votre navigateur — rien de ce que vous concevez ici n'est téléchargé nulle part. Quand vous êtes satisfait du résultat, copiez-le, téléchargez-le en tant que fichier .txt, ou renvoyez la sortie à l'entrée pour continuer à l'affiner.