🧮 BMI Calculator

BMI Calculator is an interactive health utility designed to provide users with immediate insight into their body mass status. Built with vanilla JavaScript, it translates raw physiological data into actionable health categories, offering a seamless and responsive experience for fitness tracking.

⚡ Mission: To simplify health monitoring by providing a fast, accurate, and accessible tool for Body Mass Index calculation.

---

🧠 Overview

This project serves as a practical implementation of mathematical modeling and conditional logic within the browser. It focuses on:

• 🧮 Precision Math: Implementing the standard Quetelet index formula.
• 🎯 Classification Logic: Mapping numerical outputs to standardized health categories.
• ⚡ Reactive Feedback: Ensuring the UI responds instantly to user inputs for height and weight.

---

💡 The Problem & The Solution

The Problem: Calculating BMI manually—especially squaring height and handling decimal conversions—is cumbersome and prone to error. Furthermore, a raw BMI number is often meaningless to users without the context of health categories.

The Solution: This application automates the entire pipeline. It takes simple metric inputs, runs the calculation, and instantly provides both a score and a clear classification (e.g., "Normal weight" or "Overweight"), eliminating all guesswork.

---

✨ Features

• Standardized BMI Engine: Precise calculation based on the international metric formula.
• Instant Categorization: Automatic classification based on WHO (World Health Organization) benchmarks.
• Real-Time Interaction: Updates results as the user modifies their data.
• Responsive Design: A mobile-first UI that looks great on any screen size.

---

⚙️ How It Works: The Logic Flow

The application executes the standard metric BMI formula:

$$BMI = \frac{weight\ (kg)}{height\ (m)^2}$$

1. Input Collection:
   • Weight: Captured in kilograms (kg).
   • Height: Captured in meters (m).
2. Calculation: JavaScript squares the height and divides the weight by that value.
3. Category Mapping:
   • BMI < 18.5: Underweight
   • 18.5 – 24.9: Normal weight
   • 25 – 29.9: Overweight
   • BMI ≥ 30: Obesity
4. Rendering: The score and category are displayed with dynamic styling to emphasize the result.

---

🛠 Tech Stack

Category	Technology
Structure	HTML5 (Semantic Forms)
Styling	CSS3 (Flexbox & Responsive Breakpoints)
Logic	Vanilla JavaScript (ES6+)

---

📊 Engineering Highlights

• Input Validation: Implemented checks to ensure only positive, numeric values are processed.
• Floating-Point Handling: Rounded the BMI output to one decimal place for user-friendly readability.
• Conditional UI: Used a clean logic structure to swap categories instantly without DOM-heavy re-renders.
• Error Prevention: Included logic to prevent "Division by Zero" errors if the height field is empty or set to zero.

---

⚙️ Setup & Installation

This project is a standalone frontend utility with no dependencies:

1. Clone the Repo

   git clone https://github.com/AsifpMulla123/BMI-Calculator.git
   cd BMI-Calculator
   

2. Launch Simply open the index.html file in any modern web browser to start calculating.

---

🔮 Future Roadmap

• BMI Chart: Integrate a visual scale or gauge to show where the user falls on the spectrum.
• Health Tips: Provide basic recommendations based on the calculated category.
• Dual Unit Support: Add a toggle for Imperial units (lbs & inches).
• History Tracking: Save recent BMI results in localStorage to monitor progress.

---

🤝 Connect With Me

• LinkedIn: linkedin.com/in/asif-p-mulla
• Email: asifmullaofficial@gmail.com

---

If you found this health tool useful, please give it a ⭐!