Laden Sie 6 KOSTENLOSE Wiederholungs-Hintergrundmuster für Divi . herunter

Veröffentlicht: 2018-09-06

Wenn Sie Ihrer Website diese besondere Aufmerksamkeit für Details schenken, kann dies Ihren gesamten Webdesign-Stil mehr beeinflussen, als Sie denken. Es sind normalerweise die kleinen Details, die den Leuten helfen, eine Website mit Vorlagen von einer benutzerdefinierten zu unterscheiden.

Es gibt mehrere Möglichkeiten, wie Sie anspruchsvolle Designs erzielen können. Sie können unter anderem subtile Hintergrund-Wiederholungsmuster für jedes Designelement auf Ihrer Seite verwenden. Dies hilft Ihnen nicht nur, die Größe von Hintergrundbildern zu verringern, sondern hilft Ihnen auch, leere Hintergründe zu füllen, ohne sie zu überladen.

In diesem Beitrag können Sie 6 grundlegende, aber vielseitige Hintergrundmuster herunterladen, die Sie beim Erstellen jeder Art von Website mit Divi verwenden können. Diese Muster sind großartig, um sie in der Hosentasche aufzubewahren, wenn Sie Ihr Webdesign aufpeppen müssen.

Vorschau

Schauen wir uns an, welche Ergebnisse Sie auf Ihrer Website mit diesen Hintergrundmustern erzielen können:

Hintergrund-Wiederholungsmuster

Laden Sie die Hintergrundmuster KOSTENLOS herunter

Um die kostenlosen Hintergrundmuster in die Hände zu bekommen, müssen Sie sie zuerst über die Schaltfläche unten herunterladen. Um Zugang zum Download zu erhalten, müssen Sie unsere Divi Daily-E-Mail-Liste abonnieren, indem Sie das untenstehende Formular verwenden. Als neuer Abonnent erhalten Sie jeden Montag und Freitag noch mehr Divi-Güte und ein kostenloses Divi-Layout-Paket! Wenn Sie bereits auf der Liste stehen, geben Sie einfach unten Ihre E-Mail-Adresse ein und klicken Sie auf Download. Sie werden nicht „erneut abonniert“ oder erhalten zusätzliche E-Mails.

Laden Sie die Dateien herunter
Kostenlos herunterladen

Kostenlos herunterladen

Melden Sie sich beim Divi-Newsletter an und wir senden Ihnen eine Kopie des ultimativen Divi-Landing-Page-Layout-Pakets sowie jede Menge anderer fantastischer und kostenloser Divi-Ressourcen, Tipps und Tricks per E-Mail zu. Folgen Sie mit und Sie werden in kürzester Zeit ein Divi-Meister. Wenn Sie bereits abonniert sind, geben Sie einfach unten Ihre E-Mail-Adresse ein und klicken Sie auf Download, um auf das Layout-Paket zuzugreifen.

Sie haben sich erfolgreich abonniert. Bitte überprüfen Sie Ihre E-Mail-Adresse, um Ihr Abonnement zu bestätigen und Zugang zu kostenlosen wöchentlichen Divi-Layout-Paketen zu erhalten!

Sich nähern

  • Nachdem Sie den Ordner heruntergeladen und entpackt haben, finden Sie 5 verschiedene Ordner
  • Jeder dieser Ordner stellt einen anderen Dimensionssatz dar: 1000×1000, 500×500, 100×100, 50×50 und 25×25
  • Obwohl es sich technisch gesehen um die gleichen Muster handelt, sieht das Endergebnis auf Ihrer Website je nach dem von Ihnen gewählten Dimensionssatz anders aus
  • Wir kombinieren diese Muster mit Divis Hintergrundoptionen, um den Hintergrund-Wiederholungseffekt zu erzeugen
  • Dies hält nicht nur Ihr Hintergrundbild konsistent, sondern verringert auch den Bedarf an hochauflösenden Hintergrundbildern

Wie es funktioniert

Wählen Sie einen Abschnitt auf Ihrer Seite

Sie können diese Hintergrundmuster auf jedes Designelement auf Ihrer Seite anwenden. Wir demonstrieren es, indem wir es als Abschnittshintergrund hinzufügen. Sie können diese Muster jedoch auch anderen Designelementen wie Zeilen, Spalten und Modulen hinzufügen. Je kleiner Ihr Designelement ist, desto kleiner müssen Sie mit der Größe Ihres Musters gehen, je nachdem, wie das Aussehen und die Haptik aussehen sollen.

Wählen Sie Ihre bevorzugten Abmessungen

Muster 1: 1000×1000

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Um das oben genannte Ergebnis zu erzielen, suchen Sie das Muster Nr. 1 im 1000 × 1000-Ordner Ihres Downloads. Laden Sie es dann in die Hintergrundeinstellungen Ihres Abschnitts hoch und verwenden Sie die folgenden Einstellungen zusammen damit:

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Mitte
  • Hintergrundbild wiederholen: Wiederholen

Hintergrund-Wiederholungsmuster

Mit Verlaufsüberlagerung

Möchten Sie das Muster mit Farbverlaufshintergründen mischen? Das kannst du auch machen. Im folgenden Beispiel haben wir eine einfarbige und eine halbtransparente Farbe in Kombination mit dem Platzieren des Farbverlaufs über dem Hintergrundbild verwendet, um den Mischeffekt zu erzielen.

  • Farbe 1: #E2E2E2
  • Farbe 2: rgba(255,255,255,0.37)
  • Verlaufstyp: Linear
  • Verlaufsrichtung: 181deg
  • Startposition: 7%
  • Endposition: 35%

Hintergrund-Wiederholungsmuster

Muster #1 : 500×500

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Sie können das Muster auch nur horizontal oder vertikal anzeigen lassen, indem Sie die integrierten Hintergrundoptionen von Divi verwenden. Für das obige Beispiel haben wir die Bilddatei des Musters Nr. 1 mit den Abmessungen 500 × 500 verwendet. Kombinieren Sie es nach dem Hochladen mit den folgenden Hintergrundeinstellungen:

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Oben Mitte
  • Hintergrundbild wiederholen: Wiederholung X (horizontal)

Hintergrund-Wiederholungsmuster

Muster #2 : 500×500

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Dasselbe haben wir mit dem zweiten Muster in Ihrem 500×500-Ordner gemacht.

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Oben Mitte
  • Hintergrundbild wiederholen: Wiederholung X (horizontal)

Hintergrund-Wiederholungsmuster

Muster #3 : 100×100

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Suchen Sie für das nächste Beispiel das Muster Nr. 3 im Ordner mit den Abmessungen 100 × 100 und kombinieren Sie es mit den folgenden Hintergrundoptionen, damit das Muster den gesamten Abschnitt einnimmt:

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Mitte
  • Hintergrundbild wiederholen: Wiederholen

Hintergrund-Wiederholungsmuster

Muster #4 : 50×50

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Je kleiner die Abmessungen, desto höher die Musterfrequenz. Suchen Sie den Hintergrund Nr. 4 im Ordner mit den Abmessungen 50 × 50 und kombinieren Sie ihn mit den folgenden Hintergrundeinstellungen:

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Oben Mitte
  • Hintergrundbild wiederholen: Wiederholen

Hintergrund-Wiederholungsmuster

Muster Nr. 5 : 100×100

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Das fünfte Muster ergibt ein atemberaubendes und subtiles Design, wenn Sie das Bemaßungsset 100×100 mit den folgenden Hintergrundeinstellungen verwenden:

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Oben Mitte
  • Hintergrundbild wiederholen: Wiederholen

Hintergrund-Wiederholungsmuster

Muster #6 : 25×25

Hintergrund-Wiederholungsmuster

Hintergrundeinstellungen

Suchen Sie zu guter Letzt das Muster Nr. 6 im Ordner mit den Abmessungen 25 × 25 und laden Sie es zusammen mit den folgenden Hintergrundeinstellungen in Ihren Abschnittshintergrund hoch:

  • Hintergrundbildgröße: Tatsächliche Größe
  • Position des Hintergrundbilds: Oben Mitte
  • Hintergrundbild wiederholen: Wiederholen

Hintergrund-Wiederholungsmuster

Verwenden Sie Muster auch für Zeilen-, Spalten- und Modulhintergründe

Die oben behandelten Beispiele sind nur einige der Optionen, die Ihnen zur Verfügung stehen. Sie erhalten für jedes Muster ein anderes Ergebnis, wenn Sie mit den verschiedenen enthaltenen Abmessungen experimentieren. Darüber hinaus können Sie auch die Hintergrundoptionen von Divi verwenden, um verschiedene Ergebnisse zu erzielen. Sie sind nicht darauf beschränkt, diese Hintergrundmuster nur für Abschnitte zu verwenden. Sie können diese für jedes Designelement in Divis Visual Builder verwenden. Die Größe Ihres Musters muss der Größe Ihres Elements entsprechen. Verwenden Sie die Muster für Reihen-, Spalten- und Modulhintergründe, um personalisierte und einzigartige Designs zu erstellen.

Hintergrund-Wiederholungsmuster

Vorschau

Nachdem wir nun einige verschiedene Endergebnisse behandelt haben, die Sie mit den Hintergrundmustern erzielen können, werfen wir einen letzten Blick auf das Endergebnis:

Hintergrund-Wiederholungsmuster

Abschließende Gedanken

Beim Webdesign ist es wichtig, auf Details zu achten. Es gibt viele Möglichkeiten, dies zu tun, aber in diesem Beitrag haben wir uns speziell mit der Verwendung von Hintergrundmustern befasst, um mit Divi subtile Hintergründe für Designelemente zu erhalten. Wir haben Ihnen 6 verschiedene Muster zur Verfügung gestellt, die Sie kostenlos herunterladen und verwenden können. Für jedes der Muster haben wir auch unterschiedliche Abmessungen bereitgestellt, die nach der Verwendung auf einer Seite zu unterschiedlichen Ergebnissen führen. Wenn Sie Fragen oder Anregungen haben, hinterlassen Sie einen Kommentar im Kommentarbereich unten!