CSS-Hintergrund-Explorer

Verlauf oder Muster auswählen, Farben und Abstände anpassen und das vollständige CSS kopieren. Die Vorschau folgt den Eingaben. Beide Ausgabeformate erzeugen denselben Hintergrund.

Kombinationen legen das Muster über den Verlauf. Die Musterdeckkraft reicht von 0 % (unsichtbar) bis 100 %. Die Kachelgröße gilt in Pixeln; ihr Wertebereich hängt vom Muster ab. Manche Muster verwenden mehrere Kacheln oder Vielfache dieser Größe.

Eigene CSS-Werte sind einzelne background-Werte wie linear-gradient(90deg, #123, #abc), ohne background:. Sie gelten nur für die Vorschau. Verknüpfte Bilder, geerbte Werte und CSS-Variablen hängen von der Zielseite ab, Verläufe außerdem von der Elementgröße.

Einstellungen bleiben beim Toolwechsel erhalten. Eigener CSS-Text bleibt für diese Seitensitzung im Arbeitsspeicher und wird nicht in Cookies gespeichert. Die Beispielkarte gehört nicht zum kopierten CSS.

Bei Sechsecken entspricht die Größe der Seitenlänge, bei Dreiecken und isometrischem Raster der Dreiecksseite. Bei Rauten und Argyle ist sie die Wiederholungsbreite, bei Fischgrät die Rechtecklänge. Ringe teilen sich den Mittelpunkt der Vorschau; die Größe bestimmt ihren radialen Abstand. Das Strahlenmuster wiederholt zwölf Paare von 15°-Sektoren. Sprenkel und Konturwellen sind feste dekorative Muster, keine Zufallswerte oder Geländedaten.

Genaue Kachelformen sind als SVG-Bilder im CSS eingebettet und benötigen keine externen Bilddateien. Die Bildrichtlinie der Zielseite muss Datenbilder erlauben.

Zurücksetzen stellt Vorlage, Eingaben und Ausgabeformat auf die Standardwerte zurück. Farbfelder akzeptieren #RGB oder #RRGGBB. Die CSS-Ausgabe hält lange Bild-URLs in einer Zeile; sie lassen sich horizontal durchsehen. Kopieren übernimmt immer die vollständigen Deklarationen. Live-Felder aktualisieren sich, ohne dass Enter die Kopieraktion auslöst.