|
| 1 | +# Random Background Color Changer |
| 2 | + |
| 3 | +This project is a simple application that changes the background color of the page randomly with a single button click. It also displays the current color code on the screen. |
| 4 | + |
| 5 | +--- |
| 6 | + |
| 7 | +## 🔹 Features |
| 8 | + |
| 9 | +- Randomly generates a background color. |
| 10 | +- Displays the current background color in HEX format. |
| 11 | +- Responsive design. |
| 12 | +- Smooth and instant color change. |
| 13 | +- User-friendly interface with a stylish button. |
| 14 | + |
| 15 | +--- |
| 16 | + |
| 17 | +## 🔍 How It Works |
| 18 | + |
| 19 | +- When the user clicks the "Change Color" button, a new random HEX color is generated. |
| 20 | +- The background of the page updates to the new color. |
| 21 | +- The HEX code of the current background color is displayed in real-time. |
| 22 | + |
| 23 | +--- |
| 24 | + |
| 25 | +## 💡 Technologies Used |
| 26 | + |
| 27 | +### ✨ HTML |
| 28 | + |
| 29 | +- Sets up the basic structure: a color display and a button. |
| 30 | + |
| 31 | +### 🌟 CSS |
| 32 | + |
| 33 | +- Styles the background, text, and button. |
| 34 | +- Ensures responsive and clean layout. |
| 35 | +- Adds padding, rounded corners, and shadows for better visuals. |
| 36 | + |
| 37 | +### ✨ JavaScript |
| 38 | + |
| 39 | +- Handles random color generation. |
| 40 | +- Updates the background color and the displayed HEX code dynamically. |
| 41 | +- Adds an event listener to the button for user interaction. |
| 42 | + |
| 43 | +--- |
| 44 | + |
| 45 | +## 📅 Summary |
| 46 | + |
| 47 | +This project is a fun and interactive way to learn about DOM manipulation, event handling, and color generation using **HTML**, **CSS**, and **JavaScript**. |
| 48 | + |
| 49 | +> "One click, endless colors!" |
| 50 | +
|
| 51 | +--- |
| 52 | + |
| 53 | +## 🔗 Live Demo (Optional) |
| 54 | + |
| 55 | +Add your live link here if deployed: |
| 56 | + |
| 57 | +``` |
| 58 | +https://your-live-demo-link.com |
| 59 | +``` |
| 60 | + |
| 61 | +--- |
| 62 | + |
| 63 | +## 🖼️ Screenshot |
| 64 | + |
| 65 | + |
| 66 | + |
| 67 | +_(Replace the link above with the actual screenshot URL)_ |
0 commit comments