Flüssiger Marmor
Farbadern fließen über den Bildschirm wie flüssiger Marmor oder marmoriertes Papier, erzeugt mit einem SVG-Filter.
Einstellungen
Code
<div class="pt-marble"><svg width="0" height="0" style="position:absolute"><filter id="pt-marble-f" x="-20%" y="-20%" width="140%" height="140%"><feTurbulence type="fractalNoise" baseFrequency="0.004 0.007" numOctaves="4" seed="7"/><feDisplacementMap in="SourceGraphic" scale="200"/></filter></svg><i></i></div>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Hintergründe
Wofür du ihn nutzen kannst
Marmorierung wirkt handgemacht und ein wenig luxuriös. Sie passt auf die Website einer Keramikwerkstatt, zum Launch einer Kosmetiklinie, zu einer Buchbinderei oder als Titel eines Portfolios für Innenarchitektur. Die Adern wandern ständig seitwärts, sodass sich das Muster langsam neu formt. Ein animierter Marmor-Hintergrund in HTML und CSS, die Schlieren kommen von einem SVG-Filter.
Drei ähnliche Farben plus der dunkle Grund ergeben den klassischen Look, mit einem Gold- oder Cremeton kommst du näher an echten Stein. Text setzt du am besten auf eine Karte oder eine feste Fläche, weil die Adern sonst überall durchlaufen.