Atmender Farbverlauf
Drei Farben drehen sich in einem riesigen, weichgezeichneten Kegelverlauf, während die Ränder ruhig pulsieren.
Einstellungen
Code
<div class="pt-breathe"><i></i><b></b></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
Dieser Hintergrund gehört an ruhige Orte: auf den Startbildschirm einer Meditations-App, die Website eines Yogastudios oder in den Warteraum vor einem Livestream. Die Farben drehen sich sehr langsam, die Ränder weiten sich und ziehen sich wieder zusammen wie beim Atmen. Ein animierter Farbverlauf mit conic-gradient, der kaum auffällt, und genau darum geht es.
Das Wichtigste ist hier das Tempo. In der Standardeinstellung wirkt er entspannend, drehst du zu weit auf, wird das Pulsieren hektisch und verfehlt seinen Zweck. Am besten wirkt er hinter einem kurzen Satz und einem einzigen Button.