A sleek, modern tip calculator that helps you quickly calculate the total bill amount including tip. Built with vanilla JavaScript, this calculator features a clean UI, input validation, and keyboard support.

• 🧮 Instant tip calculations
• 💻 Clean, responsive design
• ⌨️ Keyboard support (Enter key)
• ❌ Input validation with error messages
• 📱 Mobile-friendly interface
• 🎨 Modern UI with smooth animations
• 🔢 Supports decimal values for precise calculations

1. Clone the repository:

git clone https://github.com/koustavx08/tip-calculator.git

2. Navigate to the project directory:

cd tip-calculator

3. Open index.html in your preferred browser

That's it! No build process or dependencies required.

1. Enter the bill amount in the first input field
2. Enter the desired tip percentage in the second input field
3. Click "Calculate" or press Enter
4. The total amount (bill + tip) will be displayed below

tip-calculator/
│
├── index.html      # Main HTML file
├── style.css       # Styles and animations
├── script.js       # JavaScript logic
└── README.md       # Project documentation

• HTML5
• CSS3
  • Flexbox for layout
  • CSS transitions for animations
  • Mobile-first responsive design
• Vanilla JavaScript
  • DOM manipulation
  • Event handling
  • Input validation

• Lightweight: No external dependencies
• Fast loading: Single page application
• Optimized: Minimal DOM operations

• ✅ Chrome (latest)
• ✅ Firefox (latest)
• ✅ Safari (latest)
• ✅ Edge (latest)
• ✅ Opera (latest)

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

• Add split bill functionality
• Save calculation history
• Dark mode support
• Multiple currency support
• Custom tip presets
• PWA support for offline use

This project is licensed under the MIT License - see the LICENSE file for details.

• Design inspired by modern UI/UX principles
• Icons provided by Font Awesome
• Color scheme based on Material Design

Koustav Singh

Project Link

Made with ❤️ by Koustav Singh