Day 2

Magical Buttons


Santa’s workshop interface is getting crowded, and the elves are accidentally clicking the wrong buttons! To make it more intuitive and magical, Santa needs buttons with distinct hover effects that clearly indicate what they do. These buttons should be reusable across different parts of the UI.

Challenge:

Create a set of animated buttons. Each button should:

  • Change style on hover with effects like glowing, bouncing, or sparkles.
  • Have three variants: Primary (e.g., "Deliver Gifts"), Secondary (e.g., "Review Requests"), and Icon (e.g., a clickable snowflake).

Example Output:

[ Deliver Gifts ] --> Glows when hovered  
[ Review Requests ] --> Grows slightly when hovered  
[ ❄️ ] --> Sparkles when hovered  

Submit your Design


Submissions

Made by @alfonsusac | Repository