.calculator-wrapper {
max-width: 800px;
margin: 0 auto;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
color: #333;
line-height: 1.6;
}
.calc-card {
background: #f8f9fa;
border: 1px solid #e9ecef;
border-radius: 8px;
padding: 25px;
margin-bottom: 40px;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}
.calc-title {
text-align: center;
margin-top: 0;
margin-bottom: 25px;
color: #2c3e50;
font-size: 24px;
}
.input-group {
margin-bottom: 20px;
display: flex;
flex-direction: column;
}
.input-row {
display: flex;
gap: 20px;
margin-bottom: 15px;
}
.col-half {
flex: 1;
}
label {
display: block;
margin-bottom: 8px;
font-weight: 600;
font-size: 14px;
color: #495057;
}
input[type="number"], select {
width: 100%;
padding: 12px;
border: 1px solid #ced4da;
border-radius: 4px;
font-size: 16px;
box-sizing: border-box;
transition: border-color 0.2s;
}
input[type="number"]:focus, select:focus {
border-color: #007bff;
outline: none;
}
.btn-calc {
width: 100%;
padding: 14px;
background-color: #007bff;
color: white;
border: none;
border-radius: 4px;
font-size: 18px;
font-weight: bold;
cursor: pointer;
transition: background-color 0.2s;
}
.btn-calc:hover {
background-color: #0056b3;
}
.results-box {
margin-top: 25px;
padding: 20px;
background-color: #fff;
border: 1px solid #dee2e6;
border-radius: 4px;
display: none;
}
.result-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid #eee;
}
.result-item:last-child {
border-bottom: none;
}
.res-label {
font-weight: 500;
color: #6c757d;
}
.res-value {
font-weight: 700;
font-size: 18px;
color: #212529;
}
.res-highlight {
color: #28a745;
font-size: 22px;
}
.content-section h2 {
color: #2c3e50;
margin-top: 30px;
border-bottom: 2px solid #007bff;
padding-bottom: 10px;
display: inline-block;
}
.content-section h3 {
color: #34495e;
margin-top: 25px;
}
.content-section ul {
padding-left: 20px;
}
.content-section li {
margin-bottom: 10px;
}
.tip-box {
background-color: #e8f4fd;
border-left: 4px solid #007bff;
padding: 15px;
margin: 20px 0;
}
@media (max-width: 600px) {
.input-row {
flex-direction: column;
gap: 15px;
}
}
function calculateConcrete() {
// Get input values
var len = parseFloat(document.getElementById('slabLength').value);
var wid = parseFloat(document.getElementById('slabWidth').value);
var thick = parseFloat(document.getElementById('slabThickness').value);
var margin = parseFloat(document.getElementById('wasteFactor').value);
// Validation
if (isNaN(len) || isNaN(wid) || isNaN(thick)) {
alert("Please enter valid numbers for all fields.");
return;
}
if (len <= 0 || wid <= 0 || thick <= 0) {
alert("Dimensions must be greater than zero.");
return;
}
// Calculations
// 1. Convert thickness to feet
var thickFeet = thick / 12;
// 2. Calculate Cubic Feet (Base)
var cubicFeetBase = len * wid * thickFeet;
// 3. Apply Waste/Safety Margin
var cubicFeetTotal = cubicFeetBase * margin;
// 4. Convert to Cubic Yards
var cubicYards = cubicFeetTotal / 27;
// 5. Calculate Bags
// Approximate yields: 80lb bag = 0.60 cu ft, 60lb bag = 0.45 cu ft
var bags80 = Math.ceil(cubicFeetTotal / 0.60);
var bags60 = Math.ceil(cubicFeetTotal / 0.45);
// Display Results
document.getElementById('resYards').innerText = cubicYards.toFixed(2);
document.getElementById('resFeet').innerText = cubicFeetTotal.toFixed(2);
document.getElementById('resBags80').innerText = bags80;
document.getElementById('resBags60').innerText = bags60;
// Show results div
document.getElementById('results').style.display = 'block';
}
Concrete Slab Calculator
0% (Exact)
5% (Minimal)
10% (Recommended)
15% (Heavy Spillage)
Total Volume Required:
0 Cubic Yards
Volume in Cubic Feet:
0 ft³
Pre-Mix Bag Estimates:
80lb Bags (Quikrete):
0 Bags
60lb Bags:
0 Bags
How to Calculate Concrete for Slabs
Planning a patio, driveway, or shed foundation requires precise calculations to ensure you order enough material without overspending. This Concrete Slab Calculator helps you determine exactly how much premix concrete or ready-mix truck volume you need for your project.
The Concrete Volume Formula
To calculate the concrete volume, you must treat your slab as a three-dimensional box. The formula used is:
Volume = Length × Width × Thickness
However, since length and width are typically measured in feet and thickness in inches, the math requires unit conversion:
- Convert the thickness from inches to feet by dividing by 12.
- Multiply Length (ft) × Width (ft) × Thickness (ft) to get Cubic Feet.
- Divide the Cubic Feet by 27 to get Cubic Yards (the standard unit for ordering concrete trucks).
Why Add a Safety Margin?
It is standard industry practice to add a safety margin (waste factor) of 5% to 10% to your final calculation. This accounts for:
- Spillage during the pour.
- Uneven subgrade or excavation depths (a 4-inch slab might be 4.5 inches deep in spots).
- Concrete remaining in the mixer or truck chute.
- Form bowing under the weight of wet concrete.
Bags vs. Ready-Mix Truck
Should you mix it yourself or order a truck? Use the calculator results to decide:
- Under 1 Cubic Yard: It is usually more cost-effective to buy 60lb or 80lb bags and mix them in a wheelbarrow or portable mixer.
- 1 to 2 Cubic Yards: This is the "gray area" where renting a tow-behind mixer might make sense, but it is physically demanding work.
- Over 2 Cubic Yards: Ordering a ready-mix truck is highly recommended. Mixing 90+ bags of concrete by hand is difficult to do before the first batch starts to set.
Standard Thickness Guide
- 4 Inches: Standard for walkways, patios, and shed floors.
- 5-6 Inches: Recommended for driveways and garage floors holding passenger vehicles.
- 6+ Inches: Heavy equipment pads or RV parking.