Interactive Animations
Fun, interactive elements and easter eggs. Test them here before deploying to production pages.
01. Pixel Duck Pet 🦆
A wandering pixel art duck that appears randomly and says "Cuack!" occasionally. Now with configurable settings!
Status: Active
Click ⚙️ button to configure or test
⚙️ Features
- • Sprite-based pixel art animation
- • 18 frames of smooth animation
- • Configurable size, speed & animation rate
- • Optional speech bubble with custom text
- • Frontend configuration panel
- • Appears every 5-15 seconds
💡 Usage
-
• Component:
AnimatedPet.astro - • Zero dependencies
- • Fully responsive
- • Works in light/dark mode
- • Non-intrusive (pointer-events: none)
- • Reusable with any sprite folder
02. Pixel Duck 02 🦆
Alternative duck sprite with different animation style. Same features, different look!
Sprite: duck1
18 frames • Click ⚙️ to configure
03. Bat 🦇
A flying bat with simple 2-frame animation. Perfect for minimal sprites!
Sprite: bat
2 frames • Click ⚙️ to configure
📊 Specs
-
• Folder:
public/bat/ - • Frames: 2 (0.png - 1.png)
- • Default size: 0.8x (smaller)
- • Default bubble: "🦇 Flying..."
04. Mushroom 🍄
A cute mushroom character with 4-frame animation cycle.
Sprite: mushroom
4 frames • Click ⚙️ to configure
📊 Specs
-
• Folder:
public/mushroom/ - • Frames: 4 (0.png - 3.png)
- • Default size: 1x
- • Default bubble: "🍄 I'm a fungi!"
05. Frog 🐸
A hopping frog with 7-frame animation cycle. Ribbit!
Sprite: frog
7 frames • Click ⚙️ to configure
📊 Specs
-
• Folder:
public/frog/ - • Frames: 7 (0.png - 6.png)
- • Default size: 1x
- • Default bubble: "🐸 Ribbit!"
06. Piggy 🐷
A cute piggy with 10-frame animation. Oink oink!
Sprite: piggy
10 frames • Click ⚙️ to configure
📊 Specs
-
• Folder:
public/piggy/ - • Frames: 10 (0.png - 9.png)
- • Default size: 1x
- • Default bubble: "🐷 Oink!"