🌦️ Weather App

A simple and beautiful weather application that lets users check the current weather of any city using real-time data from OpenWeatherMap API.
Built with HTML, CSS, and JavaScript, this project features a minimal glassmorphic UI with soft color gradients.

---

🔍 Features

• 🌤️ Get real-time weather updates by city name
• 💡 Displays temperature, weather condition, and icons dynamically
• 🎨 Modern glass-effect UI with smooth animations
• ⚠️ “Location not found” alert for invalid entries
• 🌈 Fully responsive and beginner-friendly code

---

🧠 Tech Stack

• HTML5 – Structure
• CSS3 – Styling and animations
• JavaScript (ES6) – API integration and interactivity
• OpenWeatherMap API – Fetch live weather data

---

⚙️ How to Run

1. Clone this repository

   git clone https://github.com/piyusha-chopra/weather-app.git
   

2. Open the project folder cd weather-app

3. Open index.html in your browser (You can use Live Server in VS Code for auto reload)

🔑 API Setup

1. Go to OpenWeatherMap API

2. Create a free account and generate your API key

3. In your JavaScript file, replace the API key section:

const api_key = "YOUR_API_KEY_HERE";

4. Save your file and refresh the page to see it working 🚀

✨ UI Preview

A soft lavender background with a transparent blue-white container and glassy design.

📸 Screenshots

🏠 Home Screen

📸 Future Improvements

-> Add hourly and weekly forecast

-> Add dark/light mode toggle

-> Detect user’s current location automatically

💖 Acknowledgements

-> OpenWeatherMap for the weather data

-> Icons & illustrations from Font Awesome and Flaticon

🧑‍💻 Author

Piyusha 🚀 Passionate about front-end development and creative UI design 📫 LinkedIn Profile