.dti-calculator-wrapper {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
max-width: 800px;
margin: 0 auto;
color: #333;
line-height: 1.6;
}
.dti-calc-container {
background: #f9f9f9;
border: 1px solid #e0e0e0;
border-radius: 8px;
padding: 30px;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
margin-bottom: 40px;
}
.dti-calc-title {
text-align: center;
color: #2c3e50;
margin-bottom: 25px;
font-size: 24px;
font-weight: 700;
}
.dti-form-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
@media (max-width: 600px) {
.dti-form-grid {
grid-template-columns: 1fr;
}
}
.dti-input-group {
margin-bottom: 15px;
}
.dti-input-group label {
display: block;
margin-bottom: 5px;
font-weight: 600;
font-size: 14px;
color: #555;
}
.dti-input-group input {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
font-size: 16px;
box-sizing: border-box;
}
.dti-input-group input:focus {
border-color: #3498db;
outline: none;
box-shadow: 0 0 0 2px rgba(52,152,219,0.2);
}
.dti-btn {
background-color: #2980b9;
color: white;
border: none;
padding: 12px 24px;
font-size: 18px;
border-radius: 4px;
cursor: pointer;
width: 100%;
margin-top: 10px;
transition: background-color 0.3s;
}
.dti-btn:hover {
background-color: #2471a3;
}
.dti-results {
margin-top: 25px;
padding: 20px;
background: #fff;
border: 1px solid #ddd;
border-radius: 6px;
display: none;
}
.dti-result-row {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
font-size: 16px;
}
.dti-result-row.total {
border-top: 2px solid #eee;
padding-top: 10px;
margin-top: 10px;
font-weight: bold;
font-size: 18px;
}
.dti-percentage-box {
text-align: center;
margin-top: 15px;
padding: 15px;
border-radius: 5px;
color: white;
font-weight: bold;
}
.status-good { background-color: #27ae60; }
.status-warn { background-color: #f39c12; }
.status-bad { background-color: #c0392b; }
.dti-content h2 {
color: #2c3e50;
margin-top: 30px;
border-bottom: 2px solid #3498db;
padding-bottom: 10px;
}
.dti-content ul {
padding-left: 20px;
}
.dti-content li {
margin-bottom: 10px;
}
.dti-faq-item {
background: #fdfdfd;
border: 1px solid #eee;
padding: 15px;
margin-bottom: 15px;
border-left: 4px solid #3498db;
}
.dti-faq-item h3 {
margin-top: 0;
font-size: 18px;
}
What is Debt-to-Income (DTI) Ratio?
Your Debt-to-Income (DTI) ratio is one of the most critical metrics lenders use to assess your ability to repay a new loan. It represents the percentage of your gross monthly income that goes toward paying your monthly debt obligations.
Unlike your credit score, which measures your credit history, your DTI measures your current capacity to take on new debt. A lower DTI ratio suggests you have sufficient income to handle new payments, making you a less risky borrower.
Why Your DTI Matters for Mortgages
When applying for a mortgage, lenders typically look at two types of ratios:
- Front-End Ratio: The percentage of your income that goes specifically toward housing costs (mortgage principal, interest, taxes, insurance, and HOA fees). Lenders usually prefer this to be under 28%.
- Back-End Ratio: This includes housing costs plus all other recurring monthly debts like car loans, student loans, and credit cards. This is the number calculated by the tool above.
Understanding the Thresholds
Different loan programs have different DTI requirements, but general guidelines are:
- 35% or less: Considered excellent. You have manageable debt relative to your income.
- 36% to 43%: Considered acceptable for most conventional loans, though you may face higher interest rates.
- 44% to 49%: High risk. You may only qualify for FHA loans or need a co-signer.
- 50% or higher: Critical level. It is very difficult to obtain a Qualified Mortgage with a DTI this high.
Frequently Asked Questions
Does DTI include daily expenses?
No. Your Debt-to-Income ratio only calculates fixed monthly debt payments. It does not include variable living expenses like groceries, utilities, gas, or entertainment.
Is gross or net income used?
DTI is calculated using your gross monthly income. This is your income before taxes, insurance, and other deductions are taken out.
How can I lower my DTI quickly?
The fastest ways to lower your DTI are to pay off debts with high monthly payments (even if the balance is low) or to increase your income through a side job or salary negotiation. Avoiding new debt before a loan application is crucial.
function calculateDTI() {
// 1. Get Input Values
var grossIncomeInput = document.getElementById('grossIncome');
var housingInput = document.getElementById('rentMortgage');
var carInput = document.getElementById('carLoans');
var cardsInput = document.getElementById('creditCards');
var studentInput = document.getElementById('studentLoans');
var otherInput = document.getElementById('otherDebt');
// 2. Parse Float Values (Default to 0 if empty or NaN)
var income = parseFloat(grossIncomeInput.value) || 0;
var housing = parseFloat(housingInput.value) || 0;
var car = parseFloat(carInput.value) || 0;
var cards = parseFloat(cardsInput.value) || 0;
var student = parseFloat(studentInput.value) || 0;
var other = parseFloat(otherInput.value) || 0;
// 3. Validation
if (income <= 0) {
alert("Please enter a valid Gross Monthly Income greater than zero.");
return;
}
// 4. Calculate Total Debt
var totalDebt = housing + car + cards + student + other;
// 5. Calculate Ratio
var dtiRatio = (totalDebt / income) * 100;
// 6. Format Results
var displayIncome = document.getElementById('displayIncome');
var displayDebt = document.getElementById('displayDebt');
var displayRatio = document.getElementById('displayRatio');
var statusBox = document.getElementById('statusBox');
var resultSection = document.getElementById('dtiResultSection');
// Currency Formatting
var formatter = new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD',
});
displayIncome.textContent = formatter.format(income);
displayDebt.textContent = formatter.format(totalDebt);
displayRatio.textContent = dtiRatio.toFixed(2) + "%";
// 7. Status Logic
var statusMessage = "";
var statusClass = "";
if (dtiRatio <= 35) {
statusMessage = "EXCELLENT: Your debt is manageable.";
statusClass = "status-good";
} else if (dtiRatio <= 43) {
statusMessage = "GOOD: You are likely to qualify for most loans.";
statusClass = "status-good";
} else if (dtiRatio <= 49) {
statusMessage = "WARNING: Your DTI is high. Borrowing may be difficult.";
statusClass = "status-warn";
} else {
statusMessage = "CRITICAL: Debt load is very high relative to income.";
statusClass = "status-bad";
}
// Update UI
statusBox.className = "dti-percentage-box " + statusClass;
statusBox.textContent = statusMessage;
resultSection.style.display = "block";
}