diff --git a/emoji/icon.jpg b/emoji/icon.jpg
new file mode 100644
index 0000000..7939eb5
Binary files /dev/null and b/emoji/icon.jpg differ
diff --git a/emoji/index.html b/emoji/index.html
index 981abdc..eec47cb 100644
--- a/emoji/index.html
+++ b/emoji/index.html
@@ -1,94 +1,165 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="de">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Emoji Gravity and Collision</title>
-    <meta property="og:title" content="Emoji Gravity and Collision">
+    <title>Emoji Rain | PonyWave Tools</title>
+    <link rel="icon" href="https://tools.ponywave.de/emoji/icon.jpg">
+    <meta property="og:title" content="Emoji Rain | PonyWave Tools">
     <meta property="og:description" content="Spiele mit Emojis und der Schwerkraft">
     <meta property="og:type" content="website">
     <meta property="og:url" content="https://tools.ponywave.de/emoji">
+    <meta property="og:image" content="https://tools.ponywave.de/emoji/icon.jpg">
     <script defer src="https://stats.ponywave.de/script" data-website-id="9ef713d2-adb9-4906-9df5-708d8a8b9131" data-tag="emoji"></script>
     <style>
         body {
             margin: 0;
             overflow: hidden;
             background-color: #f0f0f0;
+            min-height: 100vh;
+            position: relative;
         }
         .emoji {
             position: absolute;
             font-size: 24px;
             user-select: none;
         }
+        .info {
+            position: fixed;
+            top: 20px;
+            left: 0;
+            right: 0;
+            text-align: center;
+            color: #333;
+            background-color: rgba(255, 255, 255, 0.7);
+            padding: 10px;
+            z-index: 100;
+            user-select: none;
+        }
+        footer {
+            position: fixed;
+            bottom: 0;
+            left: 0;
+            width: 100%;
+            padding: 1rem 0;
+            color: #333;
+            font-size: 0.9rem;
+            text-align: center;
+            border-top: 1px solid #ddd;
+            background-color: rgba(255, 255, 255, 0.9);
+            z-index: 100;
+            user-select: none;
+            height: 40px;
+        }
+        footer a {
+            color: #4CAF50;
+            text-decoration: none;
+            transition: color 0.3s;
+        }
+        footer a:hover {
+            text-decoration: underline;
+        }
+        .heart {
+            color: #e74c3c;
+            animation: heartbeat 1.5s infinite;
+        }
+        @keyframes heartbeat {
+            0% { transform: scale(1); }
+            50% { transform: scale(1.2); }
+            100% { transform: scale(1); }
+        }
     </style>
 </head>
 <body>
+    <div class="info">Klicke oder ziehe mit der Maus, um Emojis zu erzeugen!</div>
+    <footer>
+        <p>
+            <a href="https://tools.ponywave.de/">Zurück zur Startseite</a> | 
+            &copy; <span id="current-year"></span> Akamaru | Made with <span class="heart">❤️</span> by Claude
+        </p>
+    </footer>
     <script>
         const emojis = ['😀', '😂', '😊', '😉', '😎', '😍', '🤔', '😜', '🥳', '🤩'];
-
+        let isMouseDown = false;
+        
         function getRandomEmoji() {
             return emojis[Math.floor(Math.random() * emojis.length)];
         }
-
+        
         function getRandomInt(min, max) {
             return Math.floor(Math.random() * (max - min + 1)) + min;
         }
-
+        
         class Emoji {
             constructor(x, y) {
                 this.element = document.createElement('div');
                 this.element.className = 'emoji';
                 this.element.textContent = getRandomEmoji();
                 document.body.appendChild(this.element);
-
                 this.x = x;
                 this.y = y;
                 this.vx = (Math.random() - 0.5) * 2; // Random horizontal velocity
                 this.vy = (Math.random() - 0.5) * 2; // Random vertical velocity
                 this.ax = 0;
                 this.ay = 0.1; // Gravity acceleration
-
                 this.updatePosition();
             }
-
+            
             updatePosition() {
                 this.vx += this.ax;
                 this.vy += this.ay;
-
                 this.x += this.vx;
                 this.y += this.vy;
-
-                if (this.y + this.element.offsetHeight > window.innerHeight) {
-                    this.y = window.innerHeight - this.element.offsetHeight;
+                // 80px statt 60px, damit die Emojis nicht hinter dem Footer verschwinden
+                if (this.y + this.element.offsetHeight > window.innerHeight - 80) {
+                    this.y = window.innerHeight - this.element.offsetHeight - 80;
                     this.vy *= -0.7; // Bounce effect
                 }
-
                 if (this.x + this.element.offsetWidth > window.innerWidth || this.x < 0) {
                     this.vx *= -0.7; // Bounce effect
                 }
-
                 this.element.style.left = `${this.x}px`;
                 this.element.style.top = `${this.y}px`;
-
                 requestAnimationFrame(() => this.updatePosition());
             }
         }
-
-        document.addEventListener('click', (event) => {
-            const count = getRandomInt(3, 7);
+        
+        function createEmojis(x, y) {
+            const count = getRandomInt(2, 4);
             for (let i = 0; i < count; i++) {
-                new Emoji(event.clientX, event.clientY);
+                new Emoji(x, y);
+            }
+        }
+        
+        // Klick-Event
+        document.addEventListener('click', (event) => {
+            createEmojis(event.clientX, event.clientY);
+        });
+        
+        // Maus-Zieh-Events
+        document.addEventListener('mousedown', () => {
+            isMouseDown = true;
+        });
+        
+        document.addEventListener('mousemove', (event) => {
+            if (isMouseDown) {
+                // Bei Mausbewegung mit gedrückter Maustaste weniger Emojis erzeugen
+                if (Math.random() < 0.2) {
+                    createEmojis(event.clientX, event.clientY);
+                }
             }
         });
+        
+        document.addEventListener('mouseup', () => {
+            isMouseDown = false;
+        });
+        
+        document.addEventListener('mouseleave', () => {
+            isMouseDown = false;
+        });
+        
+        // Jahr für das Copyright aktualisieren
+        document.getElementById('current-year').textContent = new Date().getFullYear();
     </script>
 </body>
-</html>
-
-
-
-							<script>
-                            	
-							</script>
-                        </body>
-                        </html>
-                    
+</html>
\ No newline at end of file
