<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>USDT ↔ INR P2P Calculator</title>
<style>
body { font-family: Arial; background: #f4f7fa; display: flex; justify-content: center; padding: 40px; }
.calc { background: #fff; border: 1px solid #dde2e6; border-radius: 8px; padding: 20px; width: 380px; box-shadow: 0 2px 6px rgba(0,0,0,0.1); }
.calc h3 { margin-top: 0; color: #333; }
.calc label { display: block; margin: 12px 0 5px; color: #555; }
.calc input, .calc select, .calc button { width: 100%; padding: 8px; font-size: 14px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
.calc button { margin-top: 15px; background: #007bff; color: #fff; border: none; cursor: pointer; }
.calc button:hover { background: #0056b3; }
#result { margin-top: 20px; padding: 12px; border-radius: 4px; font-weight: bold; }
#result.success { background: #e6f9e6; border: 1px solid #28a745; color: #155724; }
#result.error { background: #fbeaea; border: 1px solid #e53935; color: #b71c1c; }
.note { font-size: 12px; margin-top: 8px; color: #555; }
</style>
</head>
<body>
<div class="calc">
<h3>P2P USDT ↔ INR Calculator</h3>
<label for="type">Transaction Type:</label>
<select id="type">
<option value="sell">Sell USDT</option>
<option value="buy">Buy USDT</option>
</select>
<label for="usdt">USDT Amount:</label>
<input id="usdt" type="number" placeholder="Enter USDT amount" />
<div id="sellFields">
<label for="kyc">KYC Status:</label>
<select id="kyc">
<option value="KYC">KYC</option>
<option value="Non-KYC">Non-KYC</option>
</select>
<label for="sellMethod">Payment Method:</label>
<select id="sellMethod">
<option value="IMPS">IMPS (₹85)</option>
<option value="CDM">CDM (₹85)</option>
<option value="Cardless">Cardless (₹84)</option>
</select>
</div>
<div id="buyFields" style="display:none">
<label for="buyMethod">Payment Method:</label>
<select id="buyMethod">
<option value="CDM">CDM (₹91.5)</option>
<option value="Cardless">Cardless Withdrawal (₹92.5)</option>
</select>
</div>
<button id="calc">Calculate</button>
<div id="result"></div>
</div>
<script>
const typeEl = document.getElementById('type');
const sellFields = document.getElementById('sellFields');
const buyFields = document.getElementById('buyFields');
const resultBox = document.getElementById('result');
// toggle Sell/Buy fields
typeEl.addEventListener('change', () => {
if (typeEl.value === 'sell') {
sellFields.style.display = '';
buyFields.style.display = 'none';
} else {
sellFields.style.display = 'none';
buyFields.style.display = '';
}
resultBox.className = '';
resultBox.innerHTML = '';
});
// tiered fee logic (same for sell & buy)
function calculateFee(usdt, status) {
let fee = 0;
if (status === 'KYC') {
if (usdt <= 100) fee = 1;
else if (usdt <= 500) fee = 3;
else if (usdt <= 1000)fee = 6;
else fee = usdt * 0.006;
} else {
if (usdt <= 100) fee = 3;
else if (usdt <= 500) fee = 6;
else if (usdt <= 1000)fee = 12;
else fee = usdt * 0.01;
}
return Math.round(fee);
}
document.getElementById('calc').addEventListener('click', () => {
const usdt = parseFloat(document.getElementById('usdt').value);
resultBox.className = '';
resultBox.innerHTML = '';
if (isNaN(usdt) || usdt <= 0) {
resultBox.classList.add('error');
return resultBox.innerText = 'Enter valid USDT amount.';
}
if (typeEl.value === 'sell') {
// Sell validations
if (usdt < 30) {
resultBox.classList.add('error');
return resultBox.innerText = 'Min 30 USDT to sell.';
}
const status = document.getElementById('kyc').value;
const method = document.getElementById('sellMethod').value;
if (method === 'CDM' && usdt < 100) {
resultBox.classList.add('error');
return resultBox.innerText = 'Min 100 USDT for CDM.';
}
const rate = (method === 'Cardless') ? 84 : 85;
const fee = calculateFee(usdt, status);
const net = usdt - fee;
const inr = net * rate;
if (method === 'Cardless' && inr < 20000) {
resultBox.classList.add('error');
return resultBox.innerText = 'Min ₹20,000 for Cardless.';
}
resultBox.classList.add('success');
resultBox.innerHTML = `
Fee: <strong>${fee} USDT</strong><br>
Net: <strong>${net} USDT</strong><br>
You receive: <strong>₹${inr.toLocaleString()}</strong>
`;
} else {
// Buy validations
const method = document.getElementById('buyMethod').value;
if (method === 'CDM' && usdt < 100) {
resultBox.classList.add('error');
return resultBox.innerText = 'Min 100 USDT for CDM.';
}
const status = document.getElementById('kyc').value; // fee still needs KYC status
const fee = calculateFee(usdt, status);
const net = usdt - fee;
let rate = (method === 'Cardless') ? 92.5 : 91.5;
let note = '';
// CDM bulk rate
const inrStandard = net * 91.5;
if (method === 'CDM' && inrStandard >= 500001 && inrStandard <= 1000000) {
rate = 91;
note = '<div class="note">Bulk rate ₹91 applied. Be fast!</div>';
}
const inr = net * rate;
if (method === 'Cardless' && inr < 20000) {
resultBox.classList.add('error');
return resultBox.innerText = 'Min ₹20,000 for Cardless.';
}
resultBox.classList.add('success');
resultBox.innerHTML = `
Fee: <strong>${fee} USDT</strong><br>
Net: <strong>${net} USDT</strong><br>
You pay: <strong>₹${inr.toLocaleString()}</strong>
${note}
`;
}
});
</script>
</body>
</html>