Calculator Tools Calculator Tools
Create

Client Fee Calculator

Jun 30, 2025

About this app

Calculate professional service fees for your accounting clients easily using our interactive Client Fee Calculator. Get instant fee breakdown.

Client Fee Calculator 🏦 Client Fee Calculator Calculate professional service fees for your accounting clients. Client Type: Sole Trader Limited Company Partnership Annual Turnover (£): Number of Employees: Properties Managed: Management Accounts: Yes Accounts Service: Yes VAT Service: Yes Payroll Service: Yes Payroll Frequency: Weekly Monthly Fortnightly Self-Assessment Service: Yes Number of Persons for Self-Assessment: Reset All Inputs

Related apps

Put this on your site

Source

                    <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Client Fee Calculator</title>
<meta name="description" content="Calculate professional service fees for accounting clients with our interactive Client Fee Calculator. Estimate fees based on turnover, client type, and selected services.">
<meta name="keywords" content="client fee calculator, accounting fees calculator, business fees calculator, professional services calculator">

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">

<script type="text/javascript">
$(document).ready(function() {
let clientType = 'Limited Company';
let turnover = 50000;
let employees = 3;
let properties = 1;
let management = true;
let services = {
accounts: true,
vat: true,
payroll: true,
pension: true,
selfAssessment: false
};
let selfAssessmentPersons = 1;
let payrollFrequency = 'Monthly';
let pensionEmployees = 3;

const fees = {
accounts: 0,
vat: 0,
payroll: 0,
pension: 0,
property: 0,
management: 0,
selfAssessment: 0,
subtotal: 0,
vatAmount: 0,
total: 0,
monthly: 0
};

const calculateAccountsFee = () => {
if (!services.accounts) return 0;
if (clientType === 'Sole Trader') {
if (turnover <= 90000) return 700;
if (turnover <= 99000) return 850;
if (turnover <= 149000) return 900;
if (turnover <= 249000) return 1000;
if (turnover <= 349000) return 1300;
if (turnover <= 499000) return 1400;
if (turnover <= 749000) return 1600;
if (turnover <= 999000) return 1800;
return 2000;
} else if (clientType === 'Limited Company') {
if (turnover <= 90000) return 875;
if (turnover <= 99000) return 975;
if (turnover <= 149000) return 1100;
if (turnover <= 249000) return 1250;
if (turnover <= 349000) return 1500;
if (turnover <= 499000) return 1600;
if (turnover <= 749000) return 1800;
if (turnover <= 999000) return 2000;
return 2200;
}
// Additional client type calculations...
return 0; // Default case for unsupported types
};

const calculateVATFee = () => {
if (!services.vat) return 0;
if (turnover <= 99000) return 550;
if (turnover <= 149000) return 750;
if (turnover <= 249000) return 850;
if (turnover <= 349000) return 950;
if (turnover <= 499000) return 1150;
if (turnover <= 749000) return 1600;
if (turnover <= 999000) return 1900;
return 2300;
};

const calculatePayrollFee = () => {
if (!services.payroll) return 0;
let fee = 0;
// Various conditions for payroll fees...
return Math.round(fee);
};

const calculatePensionFee = () => {
if (!services.pension) return 0;
// Conditions for pension fees...
return 0;
};

const calculateTotalFees = () => {
const accountsFee = calculateAccountsFee();
const vatFee = calculateVATFee();
const payrollFee = calculatePayrollFee();
const pensionFee = calculatePensionFee();
const propertyFee = calculatePropertyFee(); // Define this function based on properties
const managementFee = calculateManagementFee(); // Define this function based on management
const selfAssessmentFee = calculateSelfAssessmentFee(); // Define this parameter separately

const subtotal = accountsFee + vatFee + payrollFee + pensionFee + propertyFee + managementFee + selfAssessmentFee;
const vatAmount = subtotal * 0.2;
const total = subtotal + vatAmount;
const monthly = total / 12;

fees.accounts = accountsFee;
fees.vat = vatFee;
fees.payroll = payrollFee;
fees.pension = pensionFee;
fees.property = propertyFee;
fees.management = managementFee;
fees.selfAssessment = selfAssessmentFee;
fees.subtotal = subtotal;
fees.vatAmount = vatAmount;
fees.total = total;
fees.monthly = monthly;

displayResults();
};

const displayResults = () => {
const resultsDiv = $('#results');
resultsDiv.html(`
<h3 class="text-xl font-semibold text-gray-700 border-b-2 border-maroon-200 pb-2">📊 Fee Breakdown</h3>
<ul class="list-disc pl-5">
<li class="text-gray-600">Accounts & Tax Fee (£): <span class="font-bold text-maroon-600">£${fees.accounts.toFixed(2)}</span></li>
<li class="text-gray-600">VAT Fee (£): <span class="font-bold text-maroon-600">£${fees.vat.toFixed(2)}</span></li>
<li class="text-gray-600">Payroll Fee (£): <span class="font-bold text-maroon-600">£${fees.payroll.toFixed(2)}</span></li>
<li class="text-gray-600">Pension Fee (£): <span class="font-bold text-maroon-600">£${fees.pension.toFixed(2)}</span></li>
<li class="text-gray-600">Property Fee (£): <span class="font-bold text-maroon-600">£${fees.property.toFixed(2)}</span></li>
<li class="text-gray-600">Management Fee (£): <span class="font-bold text-maroon-600">£${fees.management.toFixed(2)}</span></li>
${services.selfAssessment ? `<li class="text-gray-600">Self Assessment Fee (£): <span class="font-bold text-maroon-600">£${fees.selfAssessment.toFixed(2)}</span></li>` : ''}
</ul>
<div class="mt-6 bg-white rounded-xl p-5 shadow-inner border border-gray-100">
<div class="grid grid-cols-2 py-2">
<span class="font-semibold text-lg">Subtotal Fee (£): </span>
<span class="font-bold text-maroon-600">£${fees.subtotal.toFixed(2)}</span>
</div>
<div class="grid grid-cols-2 py-2">
<span class="font-semibold text-lg">VAT 20% (£): </span>
<span class="font-bold text-maroon-600">£${fees.vatAmount.toFixed(2)}</span>
</div>
<div class="grid grid-cols-2 bg-white p-2 rounded-lg shadow mt-3">
<span class="font-semibold text-lg">Total Fee (£):</span>
<span class="font-bold text-2xl text-maroon-700">£${fees.total.toFixed(2)}</span>
</div>
<div class="grid grid-cols-2 bg-white p-2 shadow mt-3">
<span class="font-semibold text-lg">Monthly With VAT (£):</span>
<span class="font-bold text-maroon-600">£${fees.monthly.toFixed(2)}</span>
</div>
</div>
`);
};

const resetInputs = () => {
clientType = 'Limited Company';
turnover = 50000;
employees = 3;
properties = 1;
management = true;
services = {
accounts: true,
vat: true,
payroll: true,
pension: true,
selfAssessment: false
};
selfAssessmentPersons = 1;
payrollFrequency = 'Monthly';
pensionEmployees = 3;
calculateTotalFees();
};

// Trigger Fee calculation on initial load
calculateTotalFees();

// Attach reset function to reset button
$('#resetButton').click(resetInputs);
});
</script>

<style>
body {
font-family: 'Inter', sans-serif;
background-color: #ffffff;
color: #333;
}

#main-container {
margin: 0 auto;
max-width: 800px;
padding: 20px;
}

select, input[type="number"], input[type="text"], input[type="tel"] {
width: calc(100% - 16px);
margin: 5px 0;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
}

button {
background-color: #9A0A24;
record: none;
color: white;
padding: 10px;
border-radius: 5px;
margin-top: 10px;
cursor: pointer;
transition: background 0.3s;
}

button:hover {
background-color: #7A0A19;
}

.results-upper {
margin-top: 20px;
padding: 20px;
background: #f1f1f1;
border-radius: 10px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1 class="text-3xl font-bold">🏦 Client Fee Calculator</h1>
<p>Calculate professional service fees for your accounting clients.</p>
<div>
<label>Client Type:</label>
<select id="clientType">
<option value="Sole Trader">Sole Trader</option>
<option value="Limited Company" selected>Limited Company</option>
<option value="Partnership">Partnership</option>
</select>

<label>Annual Turnover (£):</label>
<input type="number" id="turnover" value="50000" min="0">

<label>Number of Employees:</label>
<input type="number" id="employees" value="3" min="0">

<label>Properties Managed:</label>
<input type="number" id="properties" value="1" min="0">

<div>
<label>Management Accounts:</label>
<label><input type="checkbox" id="management" checked> Yes</label>
</div>

<div>
<label>Accounts Service:</label>
<label><input type="checkbox" id="accounts" checked> Yes</label>
<label>VAT Service:</label>
<label><input type="checkbox" id="vat" checked> Yes</label>
<label>Payroll Service:</label>
<label><input type="checkbox" id="payroll" checked> Yes</label>

<div id="payrollDetails" style="display:block;">
<label>Payroll Frequency:</label>
<select id="payrollFrequency">
<option value="Weekly">Weekly</option>
<option value="Monthly" selected>Monthly</option>
<option value="Fortnightly">Fortnightly</option>
</select>
</div>

<label>Self-Assessment Service:</label>
<label><input type="checkbox" id="selfAssessment"> Yes</label>
<label>Number of Persons for Self-Assessment:</label>
<input type="number" id="selfAssessmentPersons" value="1" min="1" disabled>

<button type="button" id="resetButton">Reset All Inputs</button>
</div>
</div>
<div id="results" class="results-upper mt-6"></div>
</div>
</body>
</html>