Skip to main content
Penguin ToolsPinguin-Tools

SVG-Muster-Generator

Wiederholbare SVG-Kachelmuster erzeugen. Mustertyp, Farbe und Größe anpassen und den Code exportieren.

#6366f1
#ffffff

Vorschau

SVG-Code

<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <pattern id="custom-pattern" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse">
      <rect width="40" height="40" fill="#ffffff" />
      <circle cx="20" cy="20" r="7" fill="#6366f1" />
    </pattern>
  </defs>
  <rect width="100%" height="100%" fill="url(#custom-pattern)" />
</svg>
Tool teilen
📖

Anleitung

Step 1

Muster auswählen

Muster auswählen

Musterkategorie auswählen: geometrisch, japanisch, modern usw.

Step 2

Anpassen

Anpassen

Farben, Größe, Abstand, Drehung usw. anpassen

Step 3

SVG kopieren

SVG kopieren

SVG-Code kopieren oder als Bild herunterladen

✨

Funktionen

Echtzeit-Vorschau

Muster in Echtzeit beim Anpassen der Parameter in der Vorschau anzeigen

Vielfältige Vorlagen

Mehrere Vorlagen: geometrisch, Punkte, Linien, japanische Muster und mehr

Nahtlose Kachelung

Erzeugte Muster kacheln nahtlos ohne sichtbare Übergänge

❓

FAQ

Wiederholbare Vektormuster mit dem SVG-<pattern>-Element. Können als Hintergründe oder Füllungen verwendet werden.

🔗Verwandte Tools

🎨
Design-Tools

Farbcode-Konverter

Konvertieren Sie zwischen HEX-, RGB- und HSL-Farbcodes. Verwenden Sie die Farbauswahl und Echtzeit-Vorschau für intuitive Farbwahl.

🎨
Design-Tools

Farbwähler

Wählen Sie Farben intuitiv mit einem Farbrad und Schiebereglern. Farbcodes in HEX, RGB und HSL kopieren.

🎨
Design-Tools

Bild-Farbextraktor

Dominante Farben aus einem Bild automatisch erkennen und eine Farbpalette erzeugen. Sie können auch auf eine beliebige Stelle im Bild klicken, um einzelne Farben aufzunehmen.

🎯
Design-Tools

Bild-Durchschnittsfarbe-Picker

Berechnen Sie die Durchschnittsfarbe eines gesamten Bildes oder eines ausgewählten Bereichs. Nützlich für Farbschemata oder Thumbnail-Hintergrundfarben.

🌈
Design-Tools

CSS Farbverlauf-Generator

Erstellen Sie CSS-Farbverläufe visuell mit Ziehsteuerung. Unterstützt lineare, radiale und konische Farbverläufe mit Vorlagen.

🔲
Design-Tools

CSS Box-Shadow-Generator

Erstellen Sie CSS box-shadow visuell mit Schiebereglern. Unterstützt mehrere Schatten und Inset-Schatten.