Hintergrundmuster-Generator

Geometrische und organische Hintergrundmuster als nahtloses CSS oder SVG erstellen.

Einstellungen

Musterstil

PunkteRasterStreifenWellen

Musterfarbe

Hintergrundfarbe

Mustergröße40px

Punktradius4px

Musterdeckkraft30%

Sticraft-Musterdemo

Echtzeit-Musterwiedergabe mit hocheffizienten Inline-SVGs. Responsive und perfekt ausgerichtet.

CSS-Hintergrundcode

background-image: url("data:image/svg+xml;base64,");
background-color: #0f0f11;

Roher SVG-XML-Code

<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40">
  <circle cx="20" cy="20" r="4" fill="#ff6b35" fill-opacity="0.3" />
</svg>

So funktioniert es

Wähle ein Muster und stelle Farben, Größe und Dichte ein.
Die Vorschau der nahtlosen Kachel aktualisiert sich dabei live.
Stimme es ab, bis es zu deinem Design passt.
Kopiere das Inline-CSS oder das reine SVG.

Wofür man es nutzt

Einer Website ein dezentes, nahtloses Hintergrundmuster geben.
Eine sich wiederholende Textur für ein Design erzeugen.
CSS oder SVG für ein kachelbares Muster bekommen.

Gut zu wissen

Die Muster werden nach festen Regeln erzeugt und lassen sich nahtlos kacheln. Von Hand gezeichnete, unregelmäßige Texturen gibt es nicht.
Sehr dichte Muster vergrößern das SVG. Halte die Dichte mäßig, wenn der Hintergrund leicht bleiben soll.

Häufige Fragen

Sind die Muster nahtlos?

Ja, sie lassen sich ohne sichtbare Nähte kacheln und füllen deshalb Hintergründe jeder Größe sauber aus.

CSS oder SVG: Was soll ich nehmen?

Inline-CSS ist für einen Web-Hintergrund am schnellsten. Das reine SVG ist eine eigenständige Datei, die du bearbeiten oder anderswo weiterverwenden kannst.

Wird etwas hochgeladen?

Nein. Die Muster entstehen komplett in deinem Browser.

Hintergrundmuster-Generator

Einstellungen

Sticraft-Musterdemo

So funktioniert es

Wofür man es nutzt

Gut zu wissen

Häufige Fragen

Sind die Muster nahtlos?

CSS oder SVG: Was soll ich nehmen?

Wird etwas hochgeladen?

Verwandte Tools

So funktioniert es

Wofür man es nutzt

Gut zu wissen

Häufige Fragen

Sind die Muster nahtlos?

CSS oder SVG: Was soll ich nehmen?

Wird etwas hochgeladen?