Flashy Game Button

A pure-CSS button with gradient and 3D effects.

Community animation · MIT License

What PasteMotion changed

Bare element selectors scoped to .neo-pop-tilted-button with :where() by PasteMotion (specificity unchanged).
Customisable properties (--accent, --color-2, --color-3, --speed) lifted by PasteMotion; original values kept as fallbacks.
Reduced-motion fallback added by PasteMotion.

WidthFull

Code

index.html

<!-- © 2023 Uiverse.io · MIT License -->
<button class="neo-pop-tilted-button">
  <span>Play Now</span>
</button>

Paste the HTML where the animation should appear.
Add the CSS to your stylesheet. PasteMotion has already scoped any global rules to the element.
Adjust the custom properties (--accent, --color-2, --color-3, --speed) on .neo-pop-tilted-button to restyle it without touching the rest.
Reduced-motion users are covered: the animation calms down or stops when that setting is on.