Skip to content

Commit

Permalink
Added IT Income Tax Calculator (#1734)
Browse files Browse the repository at this point in the history
  • Loading branch information
pavitraag authored Aug 3, 2024
1 parent 5fcff9a commit 56dfd7a
Show file tree
Hide file tree
Showing 5 changed files with 224 additions and 0 deletions.
15 changes: 15 additions & 0 deletions Calculators/IT-Income-Tax-Calculator/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
# <p align="center">IT Income Tax Calculator</p>

## Description :-

This calculator helps you compute your income tax based on your gross salary, deductions, and applicable tax rebate.

## Tech Stacks :-

- HTML
- CSS
- JavaScript

## Screenshots :-

![image](https://github.com/user-attachments/assets/b6d6b5e0-3750-4850-87d3-0ada77179dc2)
47 changes: 47 additions & 0 deletions Calculators/IT-Income-Tax-Calculator/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>IT Income Tax Calculator</title>
</head>
<body>
<div class="instructions">
<h2>Instructions</h2>
<p>
Use this calculator to estimate your income tax. Enter your gross salary, deductions, and tax rebate, then click "Calculate Tax".
</p>
<ul>
<li><strong>Gross Salary:</strong> Total income before any deductions.</li>
<li><strong>Deductions:</strong> Allowable deductions such as retirement contributions, health insurance premiums, etc.</li>
<li><strong>Tax Rebate:</strong> A rebate or reduction in tax liability subtracted from the total tax due.</li>
</ul>
</div>

<div class="container">
<h1>Income Tax Calculator</h1>
<form id="tax-form">
<div class="form-group">
<label for="gross-salary">Gross Salary:</label>
<input type="number" id="gross-salary" name="gross-salary" required>
</div>

<div class="form-group">
<label for="deductions">Deductions:</label>
<input type="number" id="deductions" name="deductions" required>
</div>

<div class="form-group">
<label for="tax-rebate">Tax Rebate:</label>
<input type="number" id="tax-rebate" name="tax-rebate" required>
</div>

<button type="button" onclick="calculateTax()">Calculate Tax</button>
</form>
<div id="result" class="output"></div>
</div>

<script src="script.js"></script>
</body>
</html>
56 changes: 56 additions & 0 deletions Calculators/IT-Income-Tax-Calculator/script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
function calculateTax() {
const grossSalary = parseFloat(document.getElementById('gross-salary').value);
const deductions = parseFloat(document.getElementById('deductions').value);
const taxRebate = parseFloat(document.getElementById('tax-rebate').value);

// Input validation
if (isNaN(grossSalary) || isNaN(deductions) || isNaN(taxRebate)) {
document.getElementById('result').innerText = 'Please enter valid numbers in all fields.';
return;
}

// Validate gross salary
if (grossSalary <= 0) {
document.getElementById('result').innerText = 'Gross Salary must be greater than 0.';
return;
}

// Validate deductions
if (deductions < 0) {
document.getElementById('result').innerText = 'Deductions cannot be negative.';
return;
}

// Validate tax rebate
if (taxRebate < 0) {
document.getElementById('result').innerText = 'Tax Rebate cannot be negative.';
return;
}

// Calculate taxable income
let taxableIncome = grossSalary - deductions;
if (taxableIncome < 0) {
taxableIncome = 0; // Ensure taxable income does not go negative
}

// Calculate tax based on slabs
let tax;
if (taxableIncome <= 250000) {
tax = 0;
} else if (taxableIncome <= 500000) {
tax = (taxableIncome - 250000) * 0.05;
} else if (taxableIncome <= 1000000) {
tax = 12500 + (taxableIncome - 500000) * 0.2;
} else {
tax = 112500 + (taxableIncome - 1000000) * 0.3;
}

// Calculate total tax after applying rebate
let totalTax = tax - taxRebate;
if (totalTax < 0) {
totalTax = 0; // Ensure total tax does not go negative
}

// Display the result
document.getElementById('result').innerText = `Total Tax: ₹${totalTax.toFixed(2)}`;
}
92 changes: 92 additions & 0 deletions Calculators/IT-Income-Tax-Calculator/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background: linear-gradient(to bottom right, #5a88ca, #8a4db2); /* Example gradient background */
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
min-height: 100vh;
overflow-x: hidden;
}

.instructions {
background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent white background */
padding: 20px;
border-radius: 8px;
width: 350px; /* Same width as .container */
text-align: left; /* Left align text */
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Shadow effect */
margin-bottom: 20px;
}

.instructions h2 {
margin-top: 0;
font-size: 18px;
}

.instructions p {
margin: 0 0 10px 0; /* Adjust margins for spacing */
font-size: 14px;
color: #333;
}

.instructions ul {
margin-top: 10px; /* Adjust top margin for spacing */
padding-left: 20px; /* Indent list items */
}

.instructions li {
font-size: 14px; /* Adjust font size for consistency */
margin-bottom: 8px; /* Adjust bottom margin for spacing */
}

.container {
background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent white background */
padding: 20px;
border-radius: 8px;
text-align: center;
width: 350px; /* Adjusted width */
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Shadow effect */
}

h1 {
margin-bottom: 20px;
font-size: 24px; /* Increase font size for heading */
}

.form-group {
margin-bottom: 15px;
text-align: left; /* Left align form labels */
}

label {
display: block;
margin-bottom: 5px;
}

input[type="number"] {
width: calc(100% - 20px); /* Adjust input width */
padding: 8px;
box-sizing: border-box;
}

button {
padding: 10px 15px;
background-color: #007bff; /* Blue button */
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}

button:hover {
background-color: #0056b3; /* Darker blue on hover */
}

.output {
margin-top: 20px;
font-size: 18px;
white-space: pre-wrap; /* Preserve line breaks */
}
14 changes: 14 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2521,6 +2521,20 @@ <h3>Calculates the spread of the middle 50% of a dataset using the interquartile
</div>
</div>
</div>
<div class="box">
<div class="content">
<h2>IT Income Tax Calculator</h2>
<h3>Computes the income tax based on your gross salary, deductions, and applicable tax rebate.</h3>
<div class="card-footer">
<a href="./Calculators/IT-Income-Tax-Calculator/index.html" target="_blank">
<button>Try Now</button>
</a>
<a href="https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/IT-Income-Tax-Calculator" title="Source Code" target="_blank">
<img src="./assets/images/github.png" alt="Source Code"></img>
</a>
</div>
</div>
</div>
<div class="box">
<div class="content">
<h2>Ideal Gas Law Calculator</h2>
Expand Down

0 comments on commit 56dfd7a

Please sign in to comment.