Papierlagen-Button
Hinter dem Button verstecken sich zwei farbige Lagen, die sich beim Hover wie gestapeltes Papier auffächern.
Einstellungen
Code
<button class="uv-ply"><span class="l2" aria-hidden="true"></span><span class="l1" aria-hidden="true"></span><span class="t">Abonnieren</span></button>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 Buttons
Alle ansehen: ButtonsWofür du ihn nutzen kannst
Dieser verspielte Button leiht sich etwas von Papiercollagen und neobrutalistischen Layouts: dicke Konturen, flache Farben und zwei zusätzliche Lagen darunter. Beim Hover schieben sich die Lagen heraus und drehen sich leicht, beim Klicken liegt alles wieder flach. Passt zu Newslettern, Zines, Bildungsseiten und Marken mit handgemachter, redaktioneller Stimme.
Der Abstandsregler bestimmt, wie weit die Lagen wandern, vom feinen Versatz bis zum auffälligen Stapel. Helle, kräftige Hauptfarben funktionieren am besten, weil die Schrift dunkel bleibt und so in hellem und dunklem Modus gut lesbar ist.