So funktioniert es
- Wähle einen Mustertyp: Streifen, Punkte, Schachbrett oder Zickzack.
- Lege die Hauptfarbe, die Akzentfarbe und die Größe in Pixeln fest.
- Sieh dir die Vorschau an und kopiere dann das CSS mit der Kopieren-Schaltfläche.
Dieser Generator erzeugt sich wiederholende Muster allein mit CSS-Verläufen, du musst also keine Bilddateien hosten. Die Hauptfarbe ist der Grundhintergrund, und die Akzentfarbe wird für die darübergelegten Streifen, Punkte oder Quadrate verwendet. Die Größe wird in Pixeln von 10 bis 100 angegeben und bestimmt, wie groß jede Wiederholung ist.
Streifen erzeugt diagonale Linien im 45-Grad-Winkel, wobei jeder Streifen halb so groß wie der Größenwert ist. Punkte zeichnet kleine Kreise auf einem Raster. Schachbrett erzeugt ein zweifarbiges Schachbrettmuster. Zickzack erzeugt eine sich wiederholende Dreieckswelle. Jeder Typ liefert ein paar Zeilen CSS, die eine Hintergrundfarbe, ein aus Verläufen bestehendes Hintergrundbild und, wo nötig, eine Hintergrundgröße und -position festlegen.
Um ein Muster zu verwenden, füge die kopierten Deklarationen in die Regel eines beliebigen Elements ein, zum Beispiel eines Containers oder des body. Danach kannst du Farben oder Größe in deinem eigenen Stylesheet ändern. Da die Muster aus Verläufen bestehen, skalieren sie sauber und verursachen keine zusätzlichen Netzwerkanfragen.
Alles wird in deinem Browser erzeugt, und nichts wird hochgeladen.
Häufige Fragen
Welche Muster gibt es?
Streifen, Punkte, Schachbrett und Zickzack.
Brauche ich Bilddateien?
Nein. Die Muster nutzen CSS-Verläufe, du musst also keine Bilder hosten oder laden.
Was ändert die Größeneinstellung?
Die Abmessung in Pixeln einer Wiederholung des Musters. Größere Werte ergeben ein größeres Muster.
Kann ich das CSS auf jedem Element verwenden?
Ja. Füge die Deklarationen in die Regel eines beliebigen Elements ein, bei dem du den Hintergrund willst.
Wird meine Eingabe hochgeladen?
Nein. Das CSS wird in deinem Browser erzeugt.