Skip to content

Commit 72f011d

Browse files
authored
Update README.md
1 parent 97527da commit 72f011d

1 file changed

Lines changed: 28 additions & 18 deletions

File tree

README.md

Lines changed: 28 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,42 @@
1-
# 🎨 BG Color Changer
1+
# 🎨 Background Color Changer
22

3-
This is a beginner-friendly JavaScript project that changes the webpage's background colour when a button is clicked. It's a simple yet fun way to understand DOM manipulation and event handling in JavaScript.
3+
This is a simple and fun web project that changes the page's background colour every time you click a button. It's a beginner-friendly project created to practice basic JavaScript DOM manipulation and event handling.
44

5-
---
5+
## 🚀 Live Demo
66

7-
## 🔗 Live Demo
8-
9-
[👉 Click here to view live](https://suru190.github.io/bg-color-changer/)
10-
11-
---
7+
🔗 [Click here to view the live site](https://suru190.github.io/bg-color-changer/)
128

139
## 📸 Screenshots
1410

1511
### 🖥️ Desktop View
16-
17-
<img src="./assets/desktop-view.png" alt="Desktop View" width="600"/>
12+
![Desktop View](./desktop-view.png)
1813

1914
### 📱 Mobile View
15+
![Mobile View](./mobile-view.jpg)
16+
17+
## 🛠️ Features
18+
19+
- Random background color change
20+
- Smooth transition effect
21+
- Displays the current color code
22+
- Responsive design for mobile and desktop
23+
24+
## 🧑‍💻 Technologies Used
2025

21-
<img src="./assets/mobile-view.jpeg" alt="Mobile View" width="300"/>
26+
- HTML5
27+
- CSS3
28+
- JavaScript
2229

23-
---
30+
## ✅ What I Learned
2431

25-
## 💡 Features
32+
- DOM selection with `getElementById`
33+
- Generating random colors using `Math.random`
34+
- Adding event listeners in JavaScript
35+
- Applying styles dynamically with `style` property
36+
- Making a simple layout responsive with media-friendly CSS
2637

27-
- Random background color generator
28-
- Displays the current hex color code
29-
- Smooth color transition
30-
- Responsive design (mobile + desktop)
38+
## 🔮 Future Improvements
3139

32-
---
40+
- Add a copy button to copy the color code
41+
- Include multiple color modes (e.g., light, dark, pastel)
42+
- Add animation for background transitions

0 commit comments

Comments
 (0)