.calc-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-bottom: 25px;
}
@media (max-width: 600px) {
.calc-grid { grid-template-columns: 1fr; }
}
.input-group {
margin-bottom: 15px;
}
.input-group label {
display: block;
margin-bottom: 5px;
font-weight: 600;
color: #333;
font-size: 14px;
}
.input-group input, .input-group select {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
font-size: 16px;
box-sizing: border-box;
}
.calc-btn {
width: 100%;
padding: 12px;
background-color: #0073aa;
color: white;
border: none;
border-radius: 4px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
transition: background 0.3s;
}
.calc-btn:hover {
background-color: #005177;
}
#concrete-result {
margin-top: 25px;
padding: 20px;
background-color: #f8f9fa;
border-radius: 6px;
border-left: 5px solid #0073aa;
display: none;
}
.result-row {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #e0e0e0;
}
.result-row:last-child {
border-bottom: none;
}
.result-label { color: #555; }
.result-value { font-weight: bold; color: #000; }
.article-content {
margin-top: 40px;
line-height: 1.6;
color: #2c3e50;
}
.article-content h2 {
margin-top: 30px;
font-size: 24px;
color: #1a1a1a;
border-bottom: 2px solid #eee;
padding-bottom: 10px;
}
.article-content h3 {
font-size: 20px;
color: #333;
margin-top: 25px;
}
.error-msg {
color: #d63638;
font-weight: bold;
display: none;
margin-bottom: 15px;
}
function calculateConcrete() {
// Get input elements by specific IDs
var lengthInput = document.getElementById('slabLength');
var widthInput = document.getElementById('slabWidth');
var thickInput = document.getElementById('slabThickness');
var wasteInput = document.getElementById('wasteFactor');
var priceYardInput = document.getElementById('pricePerYard');
var priceBagInput = document.getElementById('pricePerBag');
var resultDiv = document.getElementById('concrete-result');
var errorDiv = document.getElementById('calc-error');
// Parse values
var length = parseFloat(lengthInput.value);
var width = parseFloat(widthInput.value);
var thick = parseFloat(thickInput.value);
var waste = parseFloat(wasteInput.value);
var priceYard = parseFloat(priceYardInput.value) || 0;
var priceBag = parseFloat(priceBagInput.value) || 0;
// Validation
if (isNaN(length) || isNaN(width) || isNaN(thick) || length <= 0 || width <= 0 || thick <= 0) {
errorDiv.style.display = 'block';
resultDiv.style.display = 'none';
return;
} else {
errorDiv.style.display = 'none';
}
// Core Logic
// 1. Calculate raw cubic feet: L * W * (Thick / 12)
var rawCubicFeet = length * width * (thick / 12);
// 2. Apply waste factor
var wasteMultiplier = 1 + (waste / 100);
var totalCubicFeet = rawCubicFeet * wasteMultiplier;
// 3. Convert to Cubic Yards (1 yard = 27 feet)
var totalCubicYards = totalCubicFeet / 27;
// 4. Calculate Bags
// 80lb bag yields approx 0.6 cubic feet
// 60lb bag yields approx 0.45 cubic feet
// We use ceil because you can't buy partial bags
var bags80 = Math.ceil(totalCubicFeet / 0.60);
var bags60 = Math.ceil(totalCubicFeet / 0.45);
// 5. Calculate Costs
var totalYardCost = totalCubicYards * priceYard;
var totalBagCost = bags80 * priceBag;
// Update DOM with results
document.getElementById('res-yards').innerText = totalCubicYards.toFixed(2);
document.getElementById('res-feet').innerText = totalCubicFeet.toFixed(2);
document.getElementById('res-bags80').innerText = bags80;
document.getElementById('res-bags60').innerText = bags60;
document.getElementById('res-yardCost').innerText = totalYardCost.toFixed(2);
document.getElementById('res-bagCost').innerText = totalBagCost.toFixed(2);
// Show results
resultDiv.style.display = 'block';
}
Concrete Slab Calculator
Estimate volume, bags, and cost for your project
Please enter valid numbers for length, width, and thickness.
0% (Exact)
5% (Recommended)
10% (Heavy Spillage)
Calculation Results
Total Volume Needed:
0 Cubic Yards
Volume in Cubic Feet:
0 ft³
Pre-Mix Bags Required:
80lb Bags:
0 bags
60lb Bags:
0 bags
Estimated Bag Cost (80lb):
$0.00
Estimated Ready-Mix Cost:
$0.00
How to Calculate Concrete Volume
Calculating the amount of concrete needed for a slab involves determining the volume in cubic feet and then converting that number into cubic yards, which is the standard unit of measurement for ordering ready-mix concrete.
The Concrete Formula
The basic formula for a rectangular slab is:
Volume (ft³) = Length (ft) × Width (ft) × [Thickness (in) ÷ 12]
Since thickness is usually measured in inches, it must be divided by 12 to convert it to feet before multiplying.
Converting to Cubic Yards
There are 27 cubic feet in one cubic yard. To get the final volume to order from a concrete truck:
Cubic Yards = Cubic Feet ÷ 27
How Many Bags of Concrete Do I Need?
If you are mixing the concrete yourself using pre-mix bags (like Quikrete or Sakrete), the calculation depends on the bag size. Standard yields are approximately:
- 80lb Bag: Yields approximately 0.60 cubic feet.
- 60lb Bag: Yields approximately 0.45 cubic feet.
Our calculator automatically divides your total cubic footage by these yield rates to tell you exactly how many bags to buy.
Why Add a Waste Factor?
It is industry standard to order 5% to 10% extra material. This accounts for:
- Uneven subgrade (ground) depth.
- Spillage during transport or wheelbarrowing.
- Settling of the formwork.
Running short on concrete during a pour can be a disaster, so it is always safer to have slightly too much than not enough.