⭐ Star Rating Component

A simple, interactive Star Rating UI built using HTML, CSS, and Vanilla JavaScript. Users can click on stars to give a rating between 1 and 5, with visual feedback.

🖼️ Preview

A simple 5-star rating system with hover and click effects.

Screen.Recording.2025-06-12.at.5.43.17.PM.mov

📁 Features

• Clickable star icons to set a rating from 1 to 5.
• Real-time display of selected rating.
• Gold color highlight on hover and selection.
• Clean, centered layout using flexbox.
• No external libraries – fully vanilla JavaScript.

🛠️ Technologies Used

• HTML5 for structure
• CSS3 for styling and transitions
• JavaScript (ES6) for DOM manipulation

🚀 How to Run

1. Clone or download this repository.
2. Open the index.html file in any modern web browser.
3. Click on the stars to select your rating.

📌 Code Highlights

• Uses the data-value attribute to track star value.
• Adds or removes the filled class dynamically based on selected rating.
• Updates the displayed rating (0/5, 3/5, etc.) in real-time.

📂 File Structure

star-rating/
├── index.html       # Main HTML file with inline CSS and JavaScript

📄 License

This project is open-source and free to use for learning and personal projects.