CBM Calculator – Shipment Volume Calculation Tool<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', sans-serif;\n background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);\n color: #333;\n line-height: 1.6;\n padding: 20px;\n min-height: 100vh;\n }\n\n .cbm-calculator {\n max-width: 1200px;\n margin: 0 auto;\n background: white;\n border-radius: 20px;\n box-shadow: 0 15px 50px rgba(19, 19, 55, 0.1);\n overflow: hidden;\n }\n\n .calculator-header {\n background: linear-gradient(135deg, #131337 0%, #2d2d5a 100%);\n color: white;\n padding: 90px;\n text-align: center;\n position: relative;\n overflow: hidden;\n }\n\n .calculator-header h1 {\n font-size: 2.5rem;\n margin-bottom: 15px;\n font-weight: 700;\n color: #ffffff;\n text-shadow: 0 2px 4px rgba(0,0,0,0.3);\n }\n\n .calculator-header p {\n font-size: 1.2rem;\n margin-bottom: 10px;\n color: #f0f0f0;\n opacity: 0.95;\n }\n\n .disclaimer {\n background: rgba(255, 215, 0, 0.15);\n padding: 15px;\n border-radius: 10px;\n margin-top: 20px;\n border-left: 4px solid #FFD700;\n color: #FFEAA7;\n text-align: left;\n }\n\n .disclaimer strong {\n color: #FFD700;\n }\n\n .calculator-content {\n padding: 40px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 40px;\n }\n\n @media (max-width: 768px) {\n .calculator-content {\n grid-template-columns: 1fr;\n padding: 20px;\n }\n }\n\n .form-section {\n background: #f8f9fa;\n padding: 30px;\n border-radius: 15px;\n border: 2px solid #e9ecef;\n }\n\n .form-section h2 {\n color: #131337;\n margin-bottom: 25px;\n font-size: 1.5rem;\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .form-section h2 i {\n color: #FFD700;\n }\n\n .form-group {\n margin-bottom: 20px;\n }\n\n .form-label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #131337;\n font-size: 1rem;\n }\n\n .form-input {\n width: 100%;\n padding: 12px 15px;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n font-size: 1rem;\n font-family: 'Inter', sans-serif;\n transition: all 0.3s ease;\n background: white;\n color: #333;\n }\n\n .form-input:focus {\n outline: none;\n border-color: #FFD700;\n box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.1);\n }\n\n .dimensions-grid {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 15px;\n }\n\n @media (max-width: 480px) {\n .dimensions-grid {\n grid-template-columns: 1fr;\n }\n }\n\n .unit-selection {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 10px;\n margin-bottom: 20px;\n }\n\n .unit-tab {\n padding: 15px;\n background: #e9ecef;\n border: 2px solid transparent;\n border-radius: 10px;\n text-align: center;\n cursor: pointer;\n transition: all 0.3s ease;\n font-weight: 600;\n color: #333;\n }\n\n .unit-tab.active {\n background: #FFD700;\n color: #131337;\n border-color: #131337;\n }\n\n .calculate-btn {\n width: 100%;\n background: linear-gradient(135deg, #FFD700 0%, #e6c200 100%);\n color: #131337;\n border: none;\n padding: 15px;\n border-radius: 10px;\n font-size: 1.1rem;\n font-weight: 700;\n cursor: pointer;\n transition: all 0.3s ease;\n font-family: 'Inter', sans-serif;\n margin-top: 10px;\n }\n\n .calculate-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 10px 25px rgba(255, 215, 0, 0.3);\n }\n\n .results-section {\n background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);\n padding: 30px;\n border-radius: 15px;\n border: 2px dashed #FFD700;\n }\n\n .results-placeholder {\n text-align: center;\n color: #666;\n padding: 60px 20px;\n }\n\n .results-placeholder i {\n font-size: 3rem;\n color: #e0e0e0;\n margin-bottom: 20px;\n }\n\n .cbm-result {\n display: none;\n }\n\n .result-card {\n background: white;\n padding: 25px;\n border-radius: 12px;\n box-shadow: 0 5px 20px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n border-left: 4px solid #FFD700;\n }\n\n .result-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n\n .result-title {\n font-weight: 600;\n color: #131337;\n font-size: 1.2rem;\n }\n\n .cbm-value {\n background: #131337;\n color: #FFD700;\n padding: 8px 15px;\n border-radius: 25px;\n font-weight: 700;\n font-size: 1.3rem;\n }\n\n .result-details {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n margin-top: 15px;\n }\n\n .detail-item {\n display: flex;\n justify-content: space-between;\n padding: 10px 0;\n border-bottom: 1px solid #f0f0f0;\n }\n\n .detail-label {\n color: #666;\n font-weight: 500;\n }\n\n .detail-value {\n color: #131337;\n font-weight: 600;\n }\n\n .conversion-info {\n font-size: 0.85rem;\n color: #666;\n margin-top: 5px;\n text-align: left;\n }\n\n .container-info {\n background: #e8f5e8;\n padding: 15px;\n border-radius: 8px;\n border-left: 4px solid #28a745;\n margin-top: 20px;\n color: #2d5016;\n }\n\n .info-title {\n color: #28a745;\n font-weight: 700;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .loading {\n display: none;\n text-align: center;\n padding: 40px;\n }\n\n .loading-spinner {\n border: 4px solid #f3f3f3;\n border-top: 4px solid #FFD700;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n animation: spin 1s linear infinite;\n margin: 0 auto 20px;\n }\n\n @keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n .feature-highlights {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n margin-top: 40px;\n padding: 40px;\n background: #f8f9fa;\n border-top: 1px solid #e9ecef;\n }\n\n .feature-card {\n background: white;\n padding: 25px;\n border-radius: 12px;\n text-align: center;\n box-shadow: 0 5px 15px rgba(0,0,0,0.08);\n transition: transform 0.3s ease;\n }\n\n .feature-card:hover {\n transform: translateY(-5px);\n }\n\n .feature-icon {\n font-size: 2.5rem;\n color: #FFD700;\n margin-bottom: 15px;\n }\n\n .feature-title {\n color: #131337;\n font-weight: 700;\n margin-bottom: 10px;\n font-size: 1.2rem;\n }\n\n .feature-desc {\n color: #666;\n line-height: 1.5;\n }\n\n .container-info-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 15px;\n margin-top: 20px;\n }\n\n .container-info-card {\n background: white;\n padding: 15px;\n border-radius: 8px;\n border: 1px solid #e9ecef;\n text-align: center;\n }\n\n .container-name {\n font-weight: 600;\n color: #131337;\n margin-bottom: 5px;\n }\n\n .container-specs {\n font-size: 0.85rem;\n color: #666;\n margin-bottom: 8px;\n }\n\n .container-capacity {\n font-weight: 700;\n color: #FFD700;\n background: #131337;\n padding: 5px 10px;\n border-radius: 15px;\n font-size: 0.9rem;\n }\n\n .shipping-notice {\n background: #e8f5e8;\n padding: 15px;\n border-radius: 8px;\n border-left: 4px solid #28a745;\n margin-top: 20px;\n color: #2d5016;\n }\n\n .notice-title {\n color: #28a745;\n font-weight: 700;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"cbm-calculator\">\n <div class=\"calculator-header\">\n <h1><i class=\"fas fa-cube\"><\/i> CBM Calculator<\/h1>\n <p>Tool for calculating shipment volume in cubic meters for sea and air freight<\/p>\n <div class=\"disclaimer\">\n <i class=\"fas fa-exclamation-triangle\"><\/i>\n <strong>Important Information:<\/strong>\n Cubic Meter (<strong>CBM<\/strong>) is a fundamental measurement unit in international shipping,\n calculated by multiplying Length \u00d7 Width \u00d7 Height to determine the actual volume of goods inside containers.\n Shipping companies rely on <strong>CBM<\/strong> calculation to determine required space and accurately estimate shipping costs.\n <\/div>\n <\/div>\n\n <div class=\"calculator-content\">\n \n <div class=\"form-section\">\n <h2><i class=\"fas fa-calculator\"><\/i> Shipment Data<\/h2>\n\n <div class=\"unit-selection\">\n <div class=\"unit-tab active\" data-unit=\"cm\">Centimeters (cm)<\/div>\n <div class=\"unit-tab\" data-unit=\"inch\">Inches (inch)<\/div>\n <\/div>\n\n <div class=\"form-group\">\n <label class=\"form-label\">Shipment Dimensions:<\/label>\n <div class=\"dimensions-grid\">\n <div>\n <input type=\"number\" class=\"form-input\" id=\"length\" placeholder=\"Length\" step=\"0.01\" min=\"0\" value=\"100\">\n <div class=\"conversion-info\" id=\"lengthConversion\"><\/div>\n <\/div>\n <div>\n <input type=\"number\" class=\"form-input\" id=\"width\" placeholder=\"Width\" step=\"0.01\" min=\"0\" value=\"50\">\n <div class=\"conversion-info\" id=\"widthConversion\"><\/div>\n <\/div>\n <div>\n <input type=\"number\" class=\"form-input\" id=\"height\" placeholder=\"Height\" step=\"0.01\" min=\"0\" value=\"30\">\n <div class=\"conversion-info\" id=\"heightConversion\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"form-group\">\n <label class=\"form-label\">Quantity:<\/label>\n <input type=\"number\" class=\"form-input\" id=\"quantity\" placeholder=\"Enter quantity\" step=\"1\" min=\"1\" value=\"1\">\n <\/div>\n\n <button class=\"calculate-btn\" id=\"calculateBtn\">\n <i class=\"fas fa-calculator\"><\/i> Calculate Shipment Volume\n <\/button>\n\n \n <div class=\"container-info-grid\" id=\"containerInfo\">\n <div class=\"container-info-card\">\n <div class=\"container-name\">20ft Container<\/div>\n <div class=\"container-specs\">\u2248 33 m\u00b3 – Up to 28,000 kg<\/div>\n <div class=\"container-capacity\">CBM 33<\/div>\n <\/div>\n <div class=\"container-info-card\">\n <div class=\"container-name\">40ft Container<\/div>\n <div class=\"container-specs\">\u2248 67 m\u00b3 – Up to 26,500 kg<\/div>\n <div class=\"container-capacity\">CBM 67.3<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"results-section\">\n <h2><i class=\"fas fa-chart-pie\"><\/i> Calculation Results<\/h2>\n\n <div class=\"loading\" id=\"loading\">\n <div class=\"loading-spinner\"><\/div>\n <p>Calculating shipment volume…<\/p>\n <\/div>\n\n <div class=\"results-placeholder\" id=\"resultsPlaceholder\">\n <i class=\"fas fa-cube\"><\/i>\n <h3>Enter shipment dimensions<\/h3>\n <p>Shipment volume in cubic meters will be displayed here<\/p>\n <\/div>\n\n <div class=\"cbm-result\" id=\"cbmResult\">\n \n <\/div>\n\n <div class=\"container-info\">\n <div class=\"info-title\">\n <i class=\"fas fa-info-circle\"><\/i> Important Information\n <\/div>\n <p>\u2022 Cubic Meter (CBM) is the basic unit for calculating shipment volume in international shipping.<\/p>\n <p>\u2022 CBM is calculated by multiplying Length \u00d7 Width \u00d7 Height (in meters).<\/p>\n <p>\u2022 Shipping companies use CBM to determine costs whether it’s LCL (Less than Container Load) or FCL (Full Container Load).<\/p>\n <p>\u2022 In air freight, volumetric weight is calculated based on CBM.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"feature-highlights\">\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-bolt\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Instant & Accurate Calculation<\/h3>\n <p class=\"feature-desc\">\n Calculate your shipment volume in cubic meters accurately and quickly with the ability to convert between different measurement units.\n <\/p>\n <\/div>\n\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-ruler-combined\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Multiple Units<\/h3>\n <p class=\"feature-desc\">Enter measurements in centimeters or inches and they will be automatically converted to cubic meters.<\/p>\n <\/div>\n\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-boxes\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Container Comparison<\/h3>\n <p class=\"feature-desc\">Compare your shipment volume with standard container capacities to choose the appropriate type.<\/p>\n <\/div>\n\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-shipping-fast\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Useful for Importers<\/h3>\n <p class=\"feature-desc\">\n Essential tool for every importer, exporter, and shipping company to estimate costs before starting import or export processes.\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Global variables\n let currentUnit = 'cm';\n\n \/\/ Initialize the calculator\n function initCalculator() {\n console.log(\"Initializing calculator...\");\n \n \/\/ Switch measurement units\n const unitTabs = document.querySelectorAll('.unit-tab');\n unitTabs.forEach(tab => {\n tab.addEventListener('click', function() {\n console.log(\"Unit tab clicked:\", this.dataset.unit);\n document.querySelectorAll('.unit-tab').forEach(t => t.classList.remove('active'));\n this.classList.add('active');\n\n currentUnit = this.dataset.unit;\n updateUnitUI();\n });\n });\n\n \/\/ Calculate button event\n const calculateBtn = document.getElementById('calculateBtn');\n if (calculateBtn) {\n calculateBtn.addEventListener('click', function() {\n console.log(\"Calculate button clicked\");\n calculateCBM();\n });\n } else {\n console.error(\"Calculate button not found!\");\n }\n\n \/\/ Input field events\n ['length', 'width', 'height'].forEach(id => {\n const input = document.getElementById(id);\n if (input) {\n input.addEventListener('input', updateConversionInfo);\n }\n });\n\n \/\/ Initialize with sample data\n updateUnitUI();\n }\n\n \/\/ Update unit interface\n function updateUnitUI() {\n const unitLabel = currentUnit === 'cm' ? 'centimeters' : 'inches';\n const formLabels = document.querySelectorAll('.form-label');\n if (formLabels.length > 0) {\n formLabels[0].textContent = `Shipment Dimensions (${unitLabel}):`;\n }\n updateConversionInfo();\n }\n\n \/\/ Update conversion information\n function updateConversionInfo() {\n const lengthInput = document.getElementById('length');\n const widthInput = document.getElementById('width');\n const heightInput = document.getElementById('height');\n \n if (currentUnit === 'cm') {\n document.getElementById('lengthConversion').textContent = lengthInput.value ? `${lengthInput.value} cm = ${(lengthInput.value \/ 100).toFixed(4)} m` : '';\n document.getElementById('widthConversion').textContent = widthInput.value ? `${widthInput.value} cm = ${(widthInput.value \/ 100).toFixed(4)} m` : '';\n document.getElementById('heightConversion').textContent = heightInput.value ? `${heightInput.value} cm = ${(heightInput.value \/ 100).toFixed(4)} m` : '';\n } else {\n document.getElementById('lengthConversion').textContent = lengthInput.value ? `${lengthInput.value} inch = ${(lengthInput.value * 0.0254).toFixed(4)} m` : '';\n document.getElementById('widthConversion').textContent = widthInput.value ? `${widthInput.value} inch = ${(widthInput.value * 0.0254).toFixed(4)} m` : '';\n document.getElementById('heightConversion').textContent = heightInput.value ? `${heightInput.value} inch = ${(heightInput.value * 0.0254).toFixed(4)} m` : '';\n }\n }\n\n \/\/ Calculate CBM\n function calculateCBM() {\n const length = parseFloat(document.getElementById('length').value) || 0;\n const width = parseFloat(document.getElementById('width').value) || 0;\n const height = parseFloat(document.getElementById('height').value) || 0;\n const quantity = parseInt(document.getElementById('quantity').value) || 1;\n\n console.log(\"Input values:\", { length, width, height, quantity, currentUnit });\n\n \/\/ Validate input data\n if (length <= 0 || width <= 0 || height <= 0) {\n alert('Please enter valid values for dimensions');\n return;\n }\n\n \/\/ Show loading screen\n document.getElementById('loading').style.display = 'block';\n document.getElementById('resultsPlaceholder').style.display = 'none';\n document.getElementById('cbmResult').style.display = 'none';\n\n \/\/ Simulate calculation process\n setTimeout(() => {\n performCalculation(length, width, height, quantity);\n }, 800);\n }\n\n function performCalculation(length, width, height, quantity) {\n let factor;\n if (currentUnit === 'cm') {\n factor = 0.01; \/\/ Convert cm to meters\n } else {\n factor = 0.0254; \/\/ Convert inches to meters\n }\n \n \/\/ Convert dimensions to meters\n const lengthM = length * factor;\n const widthM = width * factor;\n const heightM = height * factor;\n \n \/\/ Calculate volume\n const unitCbm = lengthM * widthM * heightM;\n const totalCbm = unitCbm * quantity;\n\n console.log(\"Calculation results:\", { unitCbm, totalCbm });\n\n \/\/ Display results\n displayResults(totalCbm, unitCbm, quantity);\n }\n\n function displayResults(totalCbm, unitCbm, quantity) {\n const resultDiv = document.getElementById('cbmResult');\n \n resultDiv.innerHTML = `\n <div class=\"result-card\">\n <div class=\"result-header\">\n <div class=\"result-title\">Total Shipment Volume<\/div>\n <div class=\"cbm-value\">${totalCbm.toFixed(4)} m\u00b3<\/div>\n <\/div>\n\n <div class=\"result-details\">\n <div class=\"detail-item\">\n <span class=\"detail-label\">Single Unit Volume:<\/span>\n <span class=\"detail-value\">${unitCbm.toFixed(4)} m\u00b3<\/span>\n <\/div>\n <div class=\"detail-item\">\n <span class=\"detail-label\">Quantity:<\/span>\n <span class=\"detail-value\">${quantity}<\/span>\n <\/div>\n <div class=\"detail-item\">\n <span class=\"detail-label\">Unit Used:<\/span>\n <span class=\"detail-value\">${currentUnit === 'cm' ? 'centimeters' : 'inches'}<\/span>\n <\/div>\n <div class=\"detail-item\">\n <span class=\"detail-label\">20ft Container Fill Rate:<\/span>\n <span class=\"detail-value\">${((totalCbm \/ 33) * 100).toFixed(1)}%<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"shipping-notice\">\n <div class=\"notice-title\">\n <i class=\"fas fa-lightbulb\"><\/i> Recommendations Based on Volume\n <\/div>\n <p>${getShippingRecommendation(totalCbm)}<\/p>\n <\/div>\n `;\n\n \/\/ Hide loading and show results\n document.getElementById('loading').style.display = 'none';\n resultDiv.style.display = 'block';\n \n console.log(\"Results displayed successfully\");\n }\n\n function getShippingRecommendation(totalCbm) {\n if (totalCbm < 1) {\n return \"Your shipment is small in size. We recommend air freight or LCL (Less than Container Load) sea freight.\";\n } else if (totalCbm < 15) {\n return \"Your shipment is medium-sized. We recommend LCL sea freight or consider a 20ft container if the goods are heavy.\";\n } else if (totalCbm < 33) {\n return \"Your shipment is large. We recommend LCL sea freight or consider a 20ft container if the goods are heavy.\";\n } else if (totalCbm < 67) {\n return \"Your shipment is very large. We recommend using a 20ft container or a 40ft container if the goods are lightweight.\";\n } else {\n return \"Your shipment is huge. We recommend using a 40ft container or a 40ft High Cube container.\";\n }\n }\n\n \/\/ Initialize the calculator when the page loads\n document.addEventListener('DOMContentLoaded', initCalculator);\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>CBM Calculator – Shipment Volume Calculation Tool CBM Calculator Tool for calculating shipment volume in cubic meters for sea and air freight Important Information: Cubic Meter (CBM) is a fundamental measurement unit in international shipping, calculated by multiplying Length \u00d7 Width \u00d7 Height to determine the actual volume of goods inside containers. Shipping companies rely […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-1003","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages\/1003","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/comments?post=1003"}],"version-history":[{"count":9,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages\/1003\/revisions"}],"predecessor-version":[{"id":1020,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages\/1003\/revisions\/1020"}],"wp:attachment":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/media?parent=1003"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1003,"date":"2025-11-30T05:01:31","date_gmt":"2025-11-30T05:01:31","guid":{"rendered":"https:\/\/www.msdaraknchina.com\/en\/?page_id=1003"},"modified":"2025-11-30T05:57:34","modified_gmt":"2025-11-30T05:57:34","slug":"cbm-calculator","status":"publish","type":"page","link":"https:\/\/www.msdaraknchina.com\/en\/cbm-calculator\/","title":{"rendered":"CBM Calculator"},"content":{"rendered":"\n\n\n\n \n \n CBM Calculator – Shipment Volume Calculation Tool<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', sans-serif;\n background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);\n color: #333;\n line-height: 1.6;\n padding: 20px;\n min-height: 100vh;\n }\n\n .cbm-calculator {\n max-width: 1200px;\n margin: 0 auto;\n background: white;\n border-radius: 20px;\n box-shadow: 0 15px 50px rgba(19, 19, 55, 0.1);\n overflow: hidden;\n }\n\n .calculator-header {\n background: linear-gradient(135deg, #131337 0%, #2d2d5a 100%);\n color: white;\n padding: 90px;\n text-align: center;\n position: relative;\n overflow: hidden;\n }\n\n .calculator-header h1 {\n font-size: 2.5rem;\n margin-bottom: 15px;\n font-weight: 700;\n color: #ffffff;\n text-shadow: 0 2px 4px rgba(0,0,0,0.3);\n }\n\n .calculator-header p {\n font-size: 1.2rem;\n margin-bottom: 10px;\n color: #f0f0f0;\n opacity: 0.95;\n }\n\n .disclaimer {\n background: rgba(255, 215, 0, 0.15);\n padding: 15px;\n border-radius: 10px;\n margin-top: 20px;\n border-left: 4px solid #FFD700;\n color: #FFEAA7;\n text-align: left;\n }\n\n .disclaimer strong {\n color: #FFD700;\n }\n\n .calculator-content {\n padding: 40px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 40px;\n }\n\n @media (max-width: 768px) {\n .calculator-content {\n grid-template-columns: 1fr;\n padding: 20px;\n }\n }\n\n .form-section {\n background: #f8f9fa;\n padding: 30px;\n border-radius: 15px;\n border: 2px solid #e9ecef;\n }\n\n .form-section h2 {\n color: #131337;\n margin-bottom: 25px;\n font-size: 1.5rem;\n display: flex;\n align-items: center;\n gap: 10px;\n }\n\n .form-section h2 i {\n color: #FFD700;\n }\n\n .form-group {\n margin-bottom: 20px;\n }\n\n .form-label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #131337;\n font-size: 1rem;\n }\n\n .form-input {\n width: 100%;\n padding: 12px 15px;\n border: 2px solid #e0e0e0;\n border-radius: 10px;\n font-size: 1rem;\n font-family: 'Inter', sans-serif;\n transition: all 0.3s ease;\n background: white;\n color: #333;\n }\n\n .form-input:focus {\n outline: none;\n border-color: #FFD700;\n box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.1);\n }\n\n .dimensions-grid {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 15px;\n }\n\n @media (max-width: 480px) {\n .dimensions-grid {\n grid-template-columns: 1fr;\n }\n }\n\n .unit-selection {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 10px;\n margin-bottom: 20px;\n }\n\n .unit-tab {\n padding: 15px;\n background: #e9ecef;\n border: 2px solid transparent;\n border-radius: 10px;\n text-align: center;\n cursor: pointer;\n transition: all 0.3s ease;\n font-weight: 600;\n color: #333;\n }\n\n .unit-tab.active {\n background: #FFD700;\n color: #131337;\n border-color: #131337;\n }\n\n .calculate-btn {\n width: 100%;\n background: linear-gradient(135deg, #FFD700 0%, #e6c200 100%);\n color: #131337;\n border: none;\n padding: 15px;\n border-radius: 10px;\n font-size: 1.1rem;\n font-weight: 700;\n cursor: pointer;\n transition: all 0.3s ease;\n font-family: 'Inter', sans-serif;\n margin-top: 10px;\n }\n\n .calculate-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 10px 25px rgba(255, 215, 0, 0.3);\n }\n\n .results-section {\n background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);\n padding: 30px;\n border-radius: 15px;\n border: 2px dashed #FFD700;\n }\n\n .results-placeholder {\n text-align: center;\n color: #666;\n padding: 60px 20px;\n }\n\n .results-placeholder i {\n font-size: 3rem;\n color: #e0e0e0;\n margin-bottom: 20px;\n }\n\n .cbm-result {\n display: none;\n }\n\n .result-card {\n background: white;\n padding: 25px;\n border-radius: 12px;\n box-shadow: 0 5px 20px rgba(0,0,0,0.1);\n margin-bottom: 20px;\n border-left: 4px solid #FFD700;\n }\n\n .result-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n\n .result-title {\n font-weight: 600;\n color: #131337;\n font-size: 1.2rem;\n }\n\n .cbm-value {\n background: #131337;\n color: #FFD700;\n padding: 8px 15px;\n border-radius: 25px;\n font-weight: 700;\n font-size: 1.3rem;\n }\n\n .result-details {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n margin-top: 15px;\n }\n\n .detail-item {\n display: flex;\n justify-content: space-between;\n padding: 10px 0;\n border-bottom: 1px solid #f0f0f0;\n }\n\n .detail-label {\n color: #666;\n font-weight: 500;\n }\n\n .detail-value {\n color: #131337;\n font-weight: 600;\n }\n\n .conversion-info {\n font-size: 0.85rem;\n color: #666;\n margin-top: 5px;\n text-align: left;\n }\n\n .container-info {\n background: #e8f5e8;\n padding: 15px;\n border-radius: 8px;\n border-left: 4px solid #28a745;\n margin-top: 20px;\n color: #2d5016;\n }\n\n .info-title {\n color: #28a745;\n font-weight: 700;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .loading {\n display: none;\n text-align: center;\n padding: 40px;\n }\n\n .loading-spinner {\n border: 4px solid #f3f3f3;\n border-top: 4px solid #FFD700;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n animation: spin 1s linear infinite;\n margin: 0 auto 20px;\n }\n\n @keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n .feature-highlights {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n margin-top: 40px;\n padding: 40px;\n background: #f8f9fa;\n border-top: 1px solid #e9ecef;\n }\n\n .feature-card {\n background: white;\n padding: 25px;\n border-radius: 12px;\n text-align: center;\n box-shadow: 0 5px 15px rgba(0,0,0,0.08);\n transition: transform 0.3s ease;\n }\n\n .feature-card:hover {\n transform: translateY(-5px);\n }\n\n .feature-icon {\n font-size: 2.5rem;\n color: #FFD700;\n margin-bottom: 15px;\n }\n\n .feature-title {\n color: #131337;\n font-weight: 700;\n margin-bottom: 10px;\n font-size: 1.2rem;\n }\n\n .feature-desc {\n color: #666;\n line-height: 1.5;\n }\n\n .container-info-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 15px;\n margin-top: 20px;\n }\n\n .container-info-card {\n background: white;\n padding: 15px;\n border-radius: 8px;\n border: 1px solid #e9ecef;\n text-align: center;\n }\n\n .container-name {\n font-weight: 600;\n color: #131337;\n margin-bottom: 5px;\n }\n\n .container-specs {\n font-size: 0.85rem;\n color: #666;\n margin-bottom: 8px;\n }\n\n .container-capacity {\n font-weight: 700;\n color: #FFD700;\n background: #131337;\n padding: 5px 10px;\n border-radius: 15px;\n font-size: 0.9rem;\n }\n\n .shipping-notice {\n background: #e8f5e8;\n padding: 15px;\n border-radius: 8px;\n border-left: 4px solid #28a745;\n margin-top: 20px;\n color: #2d5016;\n }\n\n .notice-title {\n color: #28a745;\n font-weight: 700;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"cbm-calculator\">\n <div class=\"calculator-header\">\n <h1><i class=\"fas fa-cube\"><\/i> CBM Calculator<\/h1>\n <p>Tool for calculating shipment volume in cubic meters for sea and air freight<\/p>\n <div class=\"disclaimer\">\n <i class=\"fas fa-exclamation-triangle\"><\/i>\n <strong>Important Information:<\/strong>\n Cubic Meter (<strong>CBM<\/strong>) is a fundamental measurement unit in international shipping,\n calculated by multiplying Length \u00d7 Width \u00d7 Height to determine the actual volume of goods inside containers.\n Shipping companies rely on <strong>CBM<\/strong> calculation to determine required space and accurately estimate shipping costs.\n <\/div>\n <\/div>\n\n <div class=\"calculator-content\">\n \n <div class=\"form-section\">\n <h2><i class=\"fas fa-calculator\"><\/i> Shipment Data<\/h2>\n\n <div class=\"unit-selection\">\n <div class=\"unit-tab active\" data-unit=\"cm\">Centimeters (cm)<\/div>\n <div class=\"unit-tab\" data-unit=\"inch\">Inches (inch)<\/div>\n <\/div>\n\n <div class=\"form-group\">\n <label class=\"form-label\">Shipment Dimensions:<\/label>\n <div class=\"dimensions-grid\">\n <div>\n <input type=\"number\" class=\"form-input\" id=\"length\" placeholder=\"Length\" step=\"0.01\" min=\"0\" value=\"100\">\n <div class=\"conversion-info\" id=\"lengthConversion\"><\/div>\n <\/div>\n <div>\n <input type=\"number\" class=\"form-input\" id=\"width\" placeholder=\"Width\" step=\"0.01\" min=\"0\" value=\"50\">\n <div class=\"conversion-info\" id=\"widthConversion\"><\/div>\n <\/div>\n <div>\n <input type=\"number\" class=\"form-input\" id=\"height\" placeholder=\"Height\" step=\"0.01\" min=\"0\" value=\"30\">\n <div class=\"conversion-info\" id=\"heightConversion\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"form-group\">\n <label class=\"form-label\">Quantity:<\/label>\n <input type=\"number\" class=\"form-input\" id=\"quantity\" placeholder=\"Enter quantity\" step=\"1\" min=\"1\" value=\"1\">\n <\/div>\n\n <button class=\"calculate-btn\" id=\"calculateBtn\">\n <i class=\"fas fa-calculator\"><\/i> Calculate Shipment Volume\n <\/button>\n\n \n <div class=\"container-info-grid\" id=\"containerInfo\">\n <div class=\"container-info-card\">\n <div class=\"container-name\">20ft Container<\/div>\n <div class=\"container-specs\">\u2248 33 m\u00b3 – Up to 28,000 kg<\/div>\n <div class=\"container-capacity\">CBM 33<\/div>\n <\/div>\n <div class=\"container-info-card\">\n <div class=\"container-name\">40ft Container<\/div>\n <div class=\"container-specs\">\u2248 67 m\u00b3 – Up to 26,500 kg<\/div>\n <div class=\"container-capacity\">CBM 67.3<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"results-section\">\n <h2><i class=\"fas fa-chart-pie\"><\/i> Calculation Results<\/h2>\n\n <div class=\"loading\" id=\"loading\">\n <div class=\"loading-spinner\"><\/div>\n <p>Calculating shipment volume…<\/p>\n <\/div>\n\n <div class=\"results-placeholder\" id=\"resultsPlaceholder\">\n <i class=\"fas fa-cube\"><\/i>\n <h3>Enter shipment dimensions<\/h3>\n <p>Shipment volume in cubic meters will be displayed here<\/p>\n <\/div>\n\n <div class=\"cbm-result\" id=\"cbmResult\">\n \n <\/div>\n\n <div class=\"container-info\">\n <div class=\"info-title\">\n <i class=\"fas fa-info-circle\"><\/i> Important Information\n <\/div>\n <p>\u2022 Cubic Meter (CBM) is the basic unit for calculating shipment volume in international shipping.<\/p>\n <p>\u2022 CBM is calculated by multiplying Length \u00d7 Width \u00d7 Height (in meters).<\/p>\n <p>\u2022 Shipping companies use CBM to determine costs whether it’s LCL (Less than Container Load) or FCL (Full Container Load).<\/p>\n <p>\u2022 In air freight, volumetric weight is calculated based on CBM.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"feature-highlights\">\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-bolt\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Instant & Accurate Calculation<\/h3>\n <p class=\"feature-desc\">\n Calculate your shipment volume in cubic meters accurately and quickly with the ability to convert between different measurement units.\n <\/p>\n <\/div>\n\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-ruler-combined\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Multiple Units<\/h3>\n <p class=\"feature-desc\">Enter measurements in centimeters or inches and they will be automatically converted to cubic meters.<\/p>\n <\/div>\n\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-boxes\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Container Comparison<\/h3>\n <p class=\"feature-desc\">Compare your shipment volume with standard container capacities to choose the appropriate type.<\/p>\n <\/div>\n\n <div class=\"feature-card\">\n <div class=\"feature-icon\">\n <i class=\"fas fa-shipping-fast\"><\/i>\n <\/div>\n <h3 class=\"feature-title\">Useful for Importers<\/h3>\n <p class=\"feature-desc\">\n Essential tool for every importer, exporter, and shipping company to estimate costs before starting import or export processes.\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Global variables\n let currentUnit = 'cm';\n\n \/\/ Initialize the calculator\n function initCalculator() {\n console.log(\"Initializing calculator...\");\n \n \/\/ Switch measurement units\n const unitTabs = document.querySelectorAll('.unit-tab');\n unitTabs.forEach(tab => {\n tab.addEventListener('click', function() {\n console.log(\"Unit tab clicked:\", this.dataset.unit);\n document.querySelectorAll('.unit-tab').forEach(t => t.classList.remove('active'));\n this.classList.add('active');\n\n currentUnit = this.dataset.unit;\n updateUnitUI();\n });\n });\n\n \/\/ Calculate button event\n const calculateBtn = document.getElementById('calculateBtn');\n if (calculateBtn) {\n calculateBtn.addEventListener('click', function() {\n console.log(\"Calculate button clicked\");\n calculateCBM();\n });\n } else {\n console.error(\"Calculate button not found!\");\n }\n\n \/\/ Input field events\n ['length', 'width', 'height'].forEach(id => {\n const input = document.getElementById(id);\n if (input) {\n input.addEventListener('input', updateConversionInfo);\n }\n });\n\n \/\/ Initialize with sample data\n updateUnitUI();\n }\n\n \/\/ Update unit interface\n function updateUnitUI() {\n const unitLabel = currentUnit === 'cm' ? 'centimeters' : 'inches';\n const formLabels = document.querySelectorAll('.form-label');\n if (formLabels.length > 0) {\n formLabels[0].textContent = `Shipment Dimensions (${unitLabel}):`;\n }\n updateConversionInfo();\n }\n\n \/\/ Update conversion information\n function updateConversionInfo() {\n const lengthInput = document.getElementById('length');\n const widthInput = document.getElementById('width');\n const heightInput = document.getElementById('height');\n \n if (currentUnit === 'cm') {\n document.getElementById('lengthConversion').textContent = lengthInput.value ? `${lengthInput.value} cm = ${(lengthInput.value \/ 100).toFixed(4)} m` : '';\n document.getElementById('widthConversion').textContent = widthInput.value ? `${widthInput.value} cm = ${(widthInput.value \/ 100).toFixed(4)} m` : '';\n document.getElementById('heightConversion').textContent = heightInput.value ? `${heightInput.value} cm = ${(heightInput.value \/ 100).toFixed(4)} m` : '';\n } else {\n document.getElementById('lengthConversion').textContent = lengthInput.value ? `${lengthInput.value} inch = ${(lengthInput.value * 0.0254).toFixed(4)} m` : '';\n document.getElementById('widthConversion').textContent = widthInput.value ? `${widthInput.value} inch = ${(widthInput.value * 0.0254).toFixed(4)} m` : '';\n document.getElementById('heightConversion').textContent = heightInput.value ? `${heightInput.value} inch = ${(heightInput.value * 0.0254).toFixed(4)} m` : '';\n }\n }\n\n \/\/ Calculate CBM\n function calculateCBM() {\n const length = parseFloat(document.getElementById('length').value) || 0;\n const width = parseFloat(document.getElementById('width').value) || 0;\n const height = parseFloat(document.getElementById('height').value) || 0;\n const quantity = parseInt(document.getElementById('quantity').value) || 1;\n\n console.log(\"Input values:\", { length, width, height, quantity, currentUnit });\n\n \/\/ Validate input data\n if (length <= 0 || width <= 0 || height <= 0) {\n alert('Please enter valid values for dimensions');\n return;\n }\n\n \/\/ Show loading screen\n document.getElementById('loading').style.display = 'block';\n document.getElementById('resultsPlaceholder').style.display = 'none';\n document.getElementById('cbmResult').style.display = 'none';\n\n \/\/ Simulate calculation process\n setTimeout(() => {\n performCalculation(length, width, height, quantity);\n }, 800);\n }\n\n function performCalculation(length, width, height, quantity) {\n let factor;\n if (currentUnit === 'cm') {\n factor = 0.01; \/\/ Convert cm to meters\n } else {\n factor = 0.0254; \/\/ Convert inches to meters\n }\n \n \/\/ Convert dimensions to meters\n const lengthM = length * factor;\n const widthM = width * factor;\n const heightM = height * factor;\n \n \/\/ Calculate volume\n const unitCbm = lengthM * widthM * heightM;\n const totalCbm = unitCbm * quantity;\n\n console.log(\"Calculation results:\", { unitCbm, totalCbm });\n\n \/\/ Display results\n displayResults(totalCbm, unitCbm, quantity);\n }\n\n function displayResults(totalCbm, unitCbm, quantity) {\n const resultDiv = document.getElementById('cbmResult');\n \n resultDiv.innerHTML = `\n <div class=\"result-card\">\n <div class=\"result-header\">\n <div class=\"result-title\">Total Shipment Volume<\/div>\n <div class=\"cbm-value\">${totalCbm.toFixed(4)} m\u00b3<\/div>\n <\/div>\n\n <div class=\"result-details\">\n <div class=\"detail-item\">\n <span class=\"detail-label\">Single Unit Volume:<\/span>\n <span class=\"detail-value\">${unitCbm.toFixed(4)} m\u00b3<\/span>\n <\/div>\n <div class=\"detail-item\">\n <span class=\"detail-label\">Quantity:<\/span>\n <span class=\"detail-value\">${quantity}<\/span>\n <\/div>\n <div class=\"detail-item\">\n <span class=\"detail-label\">Unit Used:<\/span>\n <span class=\"detail-value\">${currentUnit === 'cm' ? 'centimeters' : 'inches'}<\/span>\n <\/div>\n <div class=\"detail-item\">\n <span class=\"detail-label\">20ft Container Fill Rate:<\/span>\n <span class=\"detail-value\">${((totalCbm \/ 33) * 100).toFixed(1)}%<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"shipping-notice\">\n <div class=\"notice-title\">\n <i class=\"fas fa-lightbulb\"><\/i> Recommendations Based on Volume\n <\/div>\n <p>${getShippingRecommendation(totalCbm)}<\/p>\n <\/div>\n `;\n\n \/\/ Hide loading and show results\n document.getElementById('loading').style.display = 'none';\n resultDiv.style.display = 'block';\n \n console.log(\"Results displayed successfully\");\n }\n\n function getShippingRecommendation(totalCbm) {\n if (totalCbm < 1) {\n return \"Your shipment is small in size. We recommend air freight or LCL (Less than Container Load) sea freight.\";\n } else if (totalCbm < 15) {\n return \"Your shipment is medium-sized. We recommend LCL sea freight or consider a 20ft container if the goods are heavy.\";\n } else if (totalCbm < 33) {\n return \"Your shipment is large. We recommend LCL sea freight or consider a 20ft container if the goods are heavy.\";\n } else if (totalCbm < 67) {\n return \"Your shipment is very large. We recommend using a 20ft container or a 40ft container if the goods are lightweight.\";\n } else {\n return \"Your shipment is huge. We recommend using a 40ft container or a 40ft High Cube container.\";\n }\n }\n\n \/\/ Initialize the calculator when the page loads\n document.addEventListener('DOMContentLoaded', initCalculator);\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>CBM Calculator – Shipment Volume Calculation Tool CBM Calculator Tool for calculating shipment volume in cubic meters for sea and air freight Important Information: Cubic Meter (CBM) is a fundamental measurement unit in international shipping, calculated by multiplying Length \u00d7 Width \u00d7 Height to determine the actual volume of goods inside containers. Shipping companies rely […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-1003","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages\/1003","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/comments?post=1003"}],"version-history":[{"count":9,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages\/1003\/revisions"}],"predecessor-version":[{"id":1020,"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/pages\/1003\/revisions\/1020"}],"wp:attachment":[{"href":"https:\/\/www.msdaraknchina.com\/en\/wp-json\/wp\/v2\/media?parent=1003"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}