Erstelle benutzerdefinierte CSS-Keyframe-Animationen für UI-Elemente.
Create CSS `@keyframes` and the corresponding utility class for a {{Animation Style: Fade, Slide, Bounce, Spin, Pulse}} animation. The animation should have a duration of {{Duration in Seconds:1-10}} seconds, run {{Iteration Count: Infinite, 1, 2, 3}} times, and use a {{Timing Function: ease-in-out, linear, ease-in, cubic-bezier}}. Provide the code for animating a {{Element: e.g. Puco UI call-to-action button}}.
Fade, Slide, Bounce, Spin, Pulse
1-10
Infinite, 1, 2, 3
ease-in-out, linear, ease-in, cubic-bezier
e.g. Puco UI call-to-action button
Create CSS `@keyframes` and the corresponding utility class for a Fade animation. The animation should have a duration of 1-10 seconds, run Infinite times, and use a ease-in-out. Provide the code for animating a e.g. Puco UI call-to-action button.
Variablen sind in {{ und }} eingeschlossen und folgen diesem Muster:
Eine Auswahl kann auf eine vordefinierte Variablenliste per eckige Klammern verweisen. Diese erscheinen in [Orange] und bieten häufig verwendete Werte wie Farben, Töne oder Sprachen.
Du kannst auch eine durch Kommas getrennte Inline-Liste mit Optionen angeben.
Tipp: Du brauchst die PUCO-App nicht, um diese Prompts zu verwenden! Kopiere einfach die Vorlage und ersetze jeden {{…}}-Abschnitt direkt in ChatGPT, Claude, Gemini oder einem anderen KI-Assistenten durch eigenen Text.