.cpi-calculator-container {
max-width: 800px;
margin: 0 auto;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
background: #f9fbfd;
border: 1px solid #e1e4e8;
border-radius: 8px;
padding: 30px;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}
.cpi-calculator-header {
text-align: center;
margin-bottom: 25px;
}
.cpi-calculator-header h2 {
color: #2c3e50;
margin-bottom: 10px;
}
.cpi-calculator-header p {
color: #546e7a;
font-size: 0.95rem;
}
.cpi-input-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-bottom: 25px;
}
@media (max-width: 600px) {
.cpi-input-grid {
grid-template-columns: 1fr;
}
}
.cpi-input-group {
display: flex;
flex-direction: column;
}
.cpi-input-group label {
font-weight: 600;
margin-bottom: 8px;
color: #37474f;
font-size: 0.9rem;
}
.cpi-input-group input {
padding: 12px;
border: 1px solid #cfd8dc;
border-radius: 6px;
font-size: 1rem;
transition: border-color 0.2s;
}
.cpi-input-group input:focus {
border-color: #2980b9;
outline: none;
}
.cpi-input-hint {
font-size: 0.75rem;
color: #78909c;
margin-top: 4px;
}
.cpi-calc-btn {
width: 100%;
background-color: #2980b9;
color: white;
border: none;
padding: 15px;
font-size: 1.1rem;
font-weight: bold;
border-radius: 6px;
cursor: pointer;
transition: background-color 0.2s;
}
.cpi-calc-btn:hover {
background-color: #2471a3;
}
.cpi-results {
margin-top: 30px;
background: #fff;
border: 1px solid #e1e4e8;
border-radius: 6px;
padding: 20px;
display: none;
}
.cpi-result-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 0;
border-bottom: 1px solid #eee;
}
.cpi-result-item:last-child {
border-bottom: none;
}
.cpi-result-label {
color: #546e7a;
font-weight: 500;
}
.cpi-result-value {
font-weight: 700;
color: #2c3e50;
font-size: 1.2rem;
}
.cpi-highlight {
color: #27ae60;
}
.cpi-error {
color: #c0392b;
text-align: center;
margin-top: 15px;
display: none;
font-weight: bold;
}
.article-content {
max-width: 800px;
margin: 40px auto 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.6;
color: #333;
}
.article-content h2 {
color: #2c3e50;
border-bottom: 2px solid #eee;
padding-bottom: 10px;
margin-top: 30px;
}
.article-content h3 {
color: #34495e;
margin-top: 25px;
}
.article-content ul {
background: #f8f9fa;
padding: 20px 40px;
border-radius: 6px;
}
.article-content code {
background: #eef2f5;
padding: 2px 5px;
border-radius: 4px;
color: #e83e8c;
font-family: monospace;
}
.formula-box {
background-color: #e8f4f8;
border-left: 5px solid #2980b9;
padding: 15px;
margin: 20px 0;
font-style: italic;
}
How to Calculate Average Inflation Rate Using CPI
Understanding how the purchasing power of money changes over time is crucial for economic analysis, investment planning, and adjusting salaries. The most common metric used to measure this change is the Consumer Price Index (CPI). While cumulative inflation tells you the total change in prices, the Average Annual Inflation Rate provides a standardized yearly percentage, making it easier to compare inflation across different time periods.
What is the CPI?
The Consumer Price Index (CPI) is a measure that examines the weighted average of prices of a basket of consumer goods and services, such as transportation, food, and medical care. It is calculated by taking price changes for each item in the predetermined basket of goods and averaging them.
The Formulas
To calculate inflation rates using CPI data, you need the starting index value and the ending index value.
1. Cumulative Inflation Formula
This calculates the total percentage change in prices over the entire period.
Cumulative Inflation (%) = ((Ending CPI – Starting CPI) / Starting CPI) × 100
2. Average Annual Inflation Formula
To find the average rate per year (compounded), we use the geometric mean formula, often referred to as the CAGR (Compound Annual Growth Rate).
Average Annual Rate (%) = ((Ending CPI / Starting CPI) ^ (1 / n)) – 1 × 100
Where n represents the number of years between the start and end dates.
Example Calculation
Let's assume you want to calculate the inflation rate between the years 2010 and 2020.
- Starting CPI (2010): 218.056
- Ending CPI (2020): 258.811
- Number of Years (n): 10
Step 1: Cumulative Inflation
((258.811 – 218.056) / 218.056) × 100 = 18.69%
Prices rose by roughly 18.69% in total over the decade.
Step 2: Average Annual Inflation
((258.811 / 218.056) ^ (1 / 10)) – 1 = 0.0172
0.0172 × 100 = 1.72%
On average, prices increased by 1.72% each year.
Why Use the Geometric Mean?
You cannot simply divide the cumulative inflation by the number of years (arithmetic mean) to find the annual rate. This is because inflation compounds. A 2% increase on top of the previous year's increase results in a larger total change than a simple linear addition. The geometric mean formula accounts for this compounding effect, providing a mathematically accurate average.
function calculateInflation() {
// 1. Get input values
var startCPIInput = document.getElementById('cpiStart').value;
var endCPIInput = document.getElementById('cpiEnd').value;
var startYearInput = document.getElementById('yearStart').value;
var endYearInput = document.getElementById('yearEnd').value;
// Elements for display
var errorDiv = document.getElementById('cpiErrorMessage');
var resultsDiv = document.getElementById('cpiResults');
var resultYears = document.getElementById('resultYears');
var resultCumulative = document.getElementById('resultCumulative');
var resultAverage = document.getElementById('resultAverage');
// Reset display
errorDiv.style.display = 'none';
resultsDiv.style.display = 'none';
// 2. Parse values
var startCPI = parseFloat(startCPIInput);
var endCPI = parseFloat(endCPIInput);
var startYear = parseInt(startYearInput);
var endYear = parseInt(endYearInput);
// 3. Validation
if (isNaN(startCPI) || isNaN(endCPI) || isNaN(startYear) || isNaN(endYear)) {
errorDiv.innerText = "Please fill in all fields with valid numbers.";
errorDiv.style.display = 'block';
return;
}
if (startCPI <= 0) {
errorDiv.innerText = "Starting CPI must be greater than zero.";
errorDiv.style.display = 'block';
return;
}
if (endYear <= startYear) {
errorDiv.innerText = "End Year must be greater than Start Year.";
errorDiv.style.display = 'block';
return;
}
// 4. Calculations
var numberOfYears = endYear – startYear;
// Cumulative Inflation: ((End – Start) / Start) * 100
var cumulativeInflation = ((endCPI – startCPI) / startCPI) * 100;
// Average Annual Inflation (Geometric Mean): ((End / Start)^(1/n) – 1) * 100
// Formula: ( (EndCPI / StartCPI) ^ (1/years) ) – 1
var ratio = endCPI / startCPI;
var exponent = 1 / numberOfYears;
var averageAnnualInflation = (Math.pow(ratio, exponent) – 1) * 100;
// 5. Update Results
resultYears.innerText = numberOfYears + " Years";
resultCumulative.innerText = cumulativeInflation.toFixed(2) + "%";
resultAverage.innerText = averageAnnualInflation.toFixed(2) + "%";
// Show results
resultsDiv.style.display = 'block';
}