Length Unit Converter | mm \u2194 inch \u2194 ft<\/title>\n <style>\n \/* Scoped styles for Length Unit Converter - isolated from WordPress *\/\n #length-unit-converter {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n line-height: 1.5;\n box-sizing: border-box;\n max-width: 896px;\n margin: 0 auto;\n padding: 32px 16px;\n color: #1e293b;\n }\n #length-unit-converter *,\n #length-unit-converter *::before,\n #length-unit-converter *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n \n \/* Title *\/\n #length-unit-converter .luc-title {\n font-size: 24px;\n font-weight: 700;\n color: #1e293b;\n margin-bottom: 16px;\n }\n \n \/* Main Container *\/\n #length-unit-converter .luc-container {\n background: #ffffff;\n border-radius: 8px;\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n border: 1px solid #e2e8f0;\n overflow: hidden;\n }\n \n \/* Grid Layout *\/\n #length-unit-converter .luc-grid {\n display: grid;\n grid-template-columns: 1fr;\n }\n @media (min-width: 768px) {\n #length-unit-converter .luc-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n \n \/* Sections *\/\n #length-unit-converter .luc-section {\n border-bottom: 1px solid #e2e8f0;\n }\n @media (min-width: 768px) {\n #length-unit-converter .luc-section {\n border-bottom: none;\n }\n #length-unit-converter .luc-section-metric {\n border-right: 1px solid #e2e8f0;\n }\n }\n \n \/* Section Headers *\/\n #length-unit-converter .luc-header-metric {\n background: linear-gradient(to right, #2563eb, #1d4ed8);\n padding: 12px 20px;\n }\n #length-unit-converter .luc-header-imperial {\n background: linear-gradient(to right, #334155, #1e293b);\n padding: 12px 20px;\n }\n #length-unit-converter .luc-header-title {\n font-size: 18px;\n font-weight: 600;\n color: #ffffff;\n margin: 0;\n }\n \n \/* Input Section *\/\n #length-unit-converter .luc-inputs {\n padding: 20px;\n }\n #length-unit-converter .luc-input-group {\n margin-bottom: 16px;\n }\n #length-unit-converter .luc-input-group:last-child {\n margin-bottom: 0;\n }\n #length-unit-converter .luc-label {\n display: block;\n font-size: 14px;\n font-weight: 500;\n color: #475569;\n margin-bottom: 6px;\n }\n #length-unit-converter .luc-input-wrapper {\n display: flex;\n position: relative;\n }\n #length-unit-converter .luc-input {\n flex: 1;\n padding: 12px 16px;\n font-size: 18px;\n font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Consolas, \"Liberation Mono\", Menlo, monospace;\n color: #1e293b;\n background: #f8fafc;\n border: 1px solid #cbd5e1;\n border-radius: 4px 0 0 4px;\n outline: none;\n transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;\n width: 100%;\n -moz-appearance: textfield;\n }\n #length-unit-converter .luc-input::-webkit-outer-spin-button,\n #length-unit-converter .luc-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n #length-unit-converter .luc-input:focus {\n border-color: #3b82f6;\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\n background: #ffffff;\n }\n #length-unit-converter .luc-input::placeholder {\n color: #94a3b8;\n }\n \n \/* Copy Button *\/\n #length-unit-converter .luc-copy-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 12px;\n background: #f1f5f9;\n border: 1px solid #cbd5e1;\n border-left: none;\n border-radius: 0 4px 4px 0;\n cursor: pointer;\n transition: background-color 0.2s;\n position: relative;\n }\n #length-unit-converter .luc-copy-btn:hover {\n background: #e2e8f0;\n }\n #length-unit-converter .luc-copy-btn svg {\n width: 20px;\n height: 20px;\n color: #64748b;\n transition: color 0.2s;\n }\n #length-unit-converter .luc-copy-btn.copied svg {\n color: #16a34a;\n }\n \n \/* Tooltip *\/\n #length-unit-converter .luc-copy-btn::after {\n content: 'Copy';\n position: absolute;\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n padding: 4px 8px;\n background: #1e293b;\n color: #ffffff;\n font-size: 12px;\n border-radius: 4px;\n opacity: 0;\n transition: opacity 0.2s;\n pointer-events: none;\n white-space: nowrap;\n margin-bottom: 4px;\n }\n #length-unit-converter .luc-copy-btn:hover::after {\n opacity: 1;\n }\n #length-unit-converter .luc-copy-btn.copied::after {\n content: 'Copied!';\n background: #16a34a;\n }\n \n \/* Reference Section *\/\n #length-unit-converter .luc-reference {\n border-top: 1px solid #e2e8f0;\n padding: 16px 20px;\n background: #f8fafc;\n }\n #length-unit-converter .luc-reference-title {\n font-size: 14px;\n font-weight: 600;\n color: #475569;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n #length-unit-converter .luc-reference-title svg {\n width: 16px;\n height: 16px;\n color: #2563eb;\n }\n #length-unit-converter .luc-reference-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n }\n @media (min-width: 768px) {\n #length-unit-converter .luc-reference-grid {\n grid-template-columns: repeat(4, 1fr);\n }\n }\n #length-unit-converter .luc-reference-item {\n background: #ffffff;\n border-radius: 4px;\n padding: 8px 12px;\n border: 1px solid #e2e8f0;\n font-size: 14px;\n }\n #length-unit-converter .luc-reference-item span:first-child {\n color: #64748b;\n }\n #length-unit-converter .luc-reference-item span:last-child {\n font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Consolas, \"Liberation Mono\", Menlo, monospace;\n font-weight: 500;\n color: #1e293b;\n margin-left: 4px;\n }\n \n \/* Focus highlight for input group *\/\n #length-unit-converter .luc-input-group.focused {\n background: #eff6ff;\n margin: -8px;\n padding: 8px;\n border-radius: 4px;\n }\n #length-unit-converter .luc-input-group.focused + .luc-input-group {\n margin-top: 24px;\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"length-unit-converter\">\n \n <h2 class=\"luc-title\">Calculator<\/h2>\n \n \n <div class=\"luc-container\">\n \n <div class=\"luc-grid\">\n \n <div class=\"luc-section luc-section-metric\">\n <div class=\"luc-header-metric\">\n <h3 class=\"luc-header-title\">Metric Units<\/h3>\n <\/div>\n <div class=\"luc-inputs\">\n \n <div class=\"luc-input-group\" data-group=\"mm\">\n <label for=\"luc-mm\" class=\"luc-label\">Millimeter (mm)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-mm\" data-unit=\"mm\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"mm\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"cm\">\n <label for=\"luc-cm\" class=\"luc-label\">Centimeter (cm)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-cm\" data-unit=\"cm\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"cm\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"m\">\n <label for=\"luc-m\" class=\"luc-label\">Meter (m)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-m\" data-unit=\"m\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"m\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"luc-section\">\n <div class=\"luc-header-imperial\">\n <h3 class=\"luc-header-title\">Imperial Units<\/h3>\n <\/div>\n <div class=\"luc-inputs\">\n \n <div class=\"luc-input-group\" data-group=\"in\">\n <label for=\"luc-in\" class=\"luc-label\">Inch (in)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-in\" data-unit=\"in\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"in\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"ft\">\n <label for=\"luc-ft\" class=\"luc-label\">Foot (ft)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-ft\" data-unit=\"ft\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"ft\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"yd\">\n <label for=\"luc-yd\" class=\"luc-label\">Yard (yd)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-yd\" data-unit=\"yd\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"yd\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"luc-reference\">\n <h3 class=\"luc-reference-title\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\/>\n <\/svg>\n Conversion Reference\n <\/h3>\n <div class=\"luc-reference-grid\">\n <div class=\"luc-reference-item\">\n <span>1 inch =<\/span>\n <span>25.4 mm<\/span>\n <\/div>\n <div class=\"luc-reference-item\">\n <span>1 foot =<\/span>\n <span>12 inches<\/span>\n <\/div>\n <div class=\"luc-reference-item\">\n <span>1 yard =<\/span>\n <span>3 feet<\/span>\n <\/div>\n <div class=\"luc-reference-item\">\n <span>1 meter =<\/span>\n <span>1000 mm<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Length Unit Converter - Core Logic (IIFE for isolation)\n (function() {\n 'use strict';\n\n \/\/ Conversion factors to mm (base unit)\n const TO_MM = {\n mm: 1,\n cm: 10,\n m: 1000,\n in: 25.4,\n ft: 304.8, \/\/ 12 * 25.4\n yd: 914.4 \/\/ 3 * 12 * 25.4\n };\n\n \/\/ DOM Elements\n const container = document.getElementById('length-unit-converter');\n if (!container) return;\n\n const inputs = {\n mm: container.querySelector('#luc-mm'),\n cm: container.querySelector('#luc-cm'),\n m: container.querySelector('#luc-m'),\n in: container.querySelector('#luc-in'),\n ft: container.querySelector('#luc-ft'),\n yd: container.querySelector('#luc-yd')\n };\n\n const copyButtons = container.querySelectorAll('.luc-copy-btn');\n\n \/\/ State\n const currentPrecision = 4;\n let activeInput = null;\n\n \/\/ Convert value from one unit to mm\n function toMM(value, unit) {\n return value * TO_MM[unit];\n }\n\n \/\/ Convert value from mm to target unit\n function fromMM(mm, unit) {\n return mm \/ TO_MM[unit];\n }\n\n \/\/ Format number with current precision\n function formatNumber(value) {\n if (value === 0) return '0';\n \n if (Math.abs(value) < Math.pow(10, -currentPrecision)) {\n return value.toExponential(currentPrecision);\n }\n \n const formatted = value.toFixed(currentPrecision);\n return parseFloat(formatted).toString();\n }\n\n \/\/ Update all inputs except the source\n function updateAllInputs(sourceUnit, sourceValue) {\n const mm = toMM(sourceValue, sourceUnit);\n\n Object.keys(inputs).forEach(unit => {\n if (unit !== sourceUnit && inputs[unit]) {\n const convertedValue = fromMM(mm, unit);\n inputs[unit].value = sourceValue === 0 || sourceValue === '' ? '' : formatNumber(convertedValue);\n }\n });\n }\n\n \/\/ Handle input change\n function handleInput(event) {\n const input = event.target;\n const unit = input.dataset.unit;\n const value = parseFloat(input.value) || 0;\n\n activeInput = unit;\n updateAllInputs(unit, value);\n }\n\n \/\/ Copy value to clipboard\n async function copyValue(unit) {\n const input = inputs[unit];\n if (!input) return;\n \n const value = input.value || '0';\n \n try {\n await navigator.clipboard.writeText(value);\n \n const button = container.querySelector(`[data-copy=\"${unit}\"]`);\n if (!button) return;\n \n button.classList.add('copied');\n \n const svg = button.querySelector('svg');\n const originalPath = svg.innerHTML;\n svg.innerHTML = '<path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"\/>';\n \n setTimeout(() => {\n button.classList.remove('copied');\n svg.innerHTML = originalPath;\n }, 1500);\n } catch (err) {\n \/\/ Fallback for older browsers\n const textArea = document.createElement('textarea');\n textArea.value = value;\n textArea.style.position = 'fixed';\n textArea.style.left = '-9999px';\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n const button = container.querySelector(`[data-copy=\"${unit}\"]`);\n if (button) {\n button.classList.add('copied');\n setTimeout(() => button.classList.remove('copied'), 1500);\n }\n } catch (e) {\n console.error('Copy failed:', e);\n }\n document.body.removeChild(textArea);\n }\n }\n\n \/\/ Event Listeners\n Object.values(inputs).forEach(input => {\n if (!input) return;\n \n input.addEventListener('input', handleInput);\n \n input.addEventListener('focus', function() {\n const group = this.closest('.luc-input-group');\n if (group) group.classList.add('focused');\n });\n \n input.addEventListener('blur', function() {\n const group = this.closest('.luc-input-group');\n if (group) group.classList.remove('focused');\n });\n \n \/\/ Prevent scroll wheel from changing values\n input.addEventListener('wheel', function(e) {\n if (document.activeElement === this) {\n e.preventDefault();\n }\n }, { passive: false });\n });\n\n copyButtons.forEach(button => {\n button.addEventListener('click', function(e) {\n e.preventDefault();\n const unit = this.dataset.copy;\n copyValue(unit);\n });\n });\n\n })();\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Length Unit Converter is a practical online tool designed to help engineers, manufacturers, and technical professionals quickly convert between different length units with accuracy and…<\/p>","protected":false},"author":2,"featured_media":24211,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"pmpro_default_level":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[8413],"tags":[3398,8427,8429,8428],"class_list":["post-24209","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-unit-and-industry-standard-conversion","tag-engineering-tools","tag-length-conversion","tag-metric-imperial","tag-unit-converter","pmpro-has-access"],"acf":[],"jetpack_featured_media_url":"https:\/\/www.mechstream.com\/wp-content\/uploads\/2026\/02\/Length-Unit-Converter.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/posts\/24209","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/comments?post=24209"}],"version-history":[{"count":0,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/posts\/24209\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/media\/24211"}],"wp:attachment":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/media?parent=24209"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/categories?post=24209"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/tags?post=24209"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":24209,"date":"2026-02-02T08:04:23","date_gmt":"2026-02-02T08:04:23","guid":{"rendered":"https:\/\/www.mechstream.com\/?p=24209"},"modified":"2026-02-02T08:26:34","modified_gmt":"2026-02-02T08:26:34","slug":"length-unit-converter","status":"publish","type":"post","link":"https:\/\/www.mechstream.com\/ru\/length-unit-converter\/","title":{"rendered":"Length Unit Converter"},"content":{"rendered":"\n

Length Unit Converter<\/strong> is a practical online tool designed to help engineers, manufacturers, and technical professionals quickly convert between different length units with accuracy and ease. Whether you need to convert millimeters to meters, inches to feet, or metric units to imperial units, this Length Unit Converter delivers instant and reliable results. It is especially useful in mechanical design, metal fabrication, machining, construction, and international trade scenarios where precise dimensional conversion is critical. With a simple interface and fast calculation, the Length Unit Converter reduces manual errors and improves efficiency in daily engineering and production tasks.<\/p>\n\n\n\n\n\n\n \n \n Length Unit Converter | mm \u2194 inch \u2194 ft<\/title>\n <style>\n \/* Scoped styles for Length Unit Converter - isolated from WordPress *\/\n #length-unit-converter {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n line-height: 1.5;\n box-sizing: border-box;\n max-width: 896px;\n margin: 0 auto;\n padding: 32px 16px;\n color: #1e293b;\n }\n #length-unit-converter *,\n #length-unit-converter *::before,\n #length-unit-converter *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n \n \/* Title *\/\n #length-unit-converter .luc-title {\n font-size: 24px;\n font-weight: 700;\n color: #1e293b;\n margin-bottom: 16px;\n }\n \n \/* Main Container *\/\n #length-unit-converter .luc-container {\n background: #ffffff;\n border-radius: 8px;\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n border: 1px solid #e2e8f0;\n overflow: hidden;\n }\n \n \/* Grid Layout *\/\n #length-unit-converter .luc-grid {\n display: grid;\n grid-template-columns: 1fr;\n }\n @media (min-width: 768px) {\n #length-unit-converter .luc-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n \n \/* Sections *\/\n #length-unit-converter .luc-section {\n border-bottom: 1px solid #e2e8f0;\n }\n @media (min-width: 768px) {\n #length-unit-converter .luc-section {\n border-bottom: none;\n }\n #length-unit-converter .luc-section-metric {\n border-right: 1px solid #e2e8f0;\n }\n }\n \n \/* Section Headers *\/\n #length-unit-converter .luc-header-metric {\n background: linear-gradient(to right, #2563eb, #1d4ed8);\n padding: 12px 20px;\n }\n #length-unit-converter .luc-header-imperial {\n background: linear-gradient(to right, #334155, #1e293b);\n padding: 12px 20px;\n }\n #length-unit-converter .luc-header-title {\n font-size: 18px;\n font-weight: 600;\n color: #ffffff;\n margin: 0;\n }\n \n \/* Input Section *\/\n #length-unit-converter .luc-inputs {\n padding: 20px;\n }\n #length-unit-converter .luc-input-group {\n margin-bottom: 16px;\n }\n #length-unit-converter .luc-input-group:last-child {\n margin-bottom: 0;\n }\n #length-unit-converter .luc-label {\n display: block;\n font-size: 14px;\n font-weight: 500;\n color: #475569;\n margin-bottom: 6px;\n }\n #length-unit-converter .luc-input-wrapper {\n display: flex;\n position: relative;\n }\n #length-unit-converter .luc-input {\n flex: 1;\n padding: 12px 16px;\n font-size: 18px;\n font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Consolas, \"Liberation Mono\", Menlo, monospace;\n color: #1e293b;\n background: #f8fafc;\n border: 1px solid #cbd5e1;\n border-radius: 4px 0 0 4px;\n outline: none;\n transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;\n width: 100%;\n -moz-appearance: textfield;\n }\n #length-unit-converter .luc-input::-webkit-outer-spin-button,\n #length-unit-converter .luc-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n #length-unit-converter .luc-input:focus {\n border-color: #3b82f6;\n box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);\n background: #ffffff;\n }\n #length-unit-converter .luc-input::placeholder {\n color: #94a3b8;\n }\n \n \/* Copy Button *\/\n #length-unit-converter .luc-copy-btn {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 12px;\n background: #f1f5f9;\n border: 1px solid #cbd5e1;\n border-left: none;\n border-radius: 0 4px 4px 0;\n cursor: pointer;\n transition: background-color 0.2s;\n position: relative;\n }\n #length-unit-converter .luc-copy-btn:hover {\n background: #e2e8f0;\n }\n #length-unit-converter .luc-copy-btn svg {\n width: 20px;\n height: 20px;\n color: #64748b;\n transition: color 0.2s;\n }\n #length-unit-converter .luc-copy-btn.copied svg {\n color: #16a34a;\n }\n \n \/* Tooltip *\/\n #length-unit-converter .luc-copy-btn::after {\n content: 'Copy';\n position: absolute;\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n padding: 4px 8px;\n background: #1e293b;\n color: #ffffff;\n font-size: 12px;\n border-radius: 4px;\n opacity: 0;\n transition: opacity 0.2s;\n pointer-events: none;\n white-space: nowrap;\n margin-bottom: 4px;\n }\n #length-unit-converter .luc-copy-btn:hover::after {\n opacity: 1;\n }\n #length-unit-converter .luc-copy-btn.copied::after {\n content: 'Copied!';\n background: #16a34a;\n }\n \n \/* Reference Section *\/\n #length-unit-converter .luc-reference {\n border-top: 1px solid #e2e8f0;\n padding: 16px 20px;\n background: #f8fafc;\n }\n #length-unit-converter .luc-reference-title {\n font-size: 14px;\n font-weight: 600;\n color: #475569;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n #length-unit-converter .luc-reference-title svg {\n width: 16px;\n height: 16px;\n color: #2563eb;\n }\n #length-unit-converter .luc-reference-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n }\n @media (min-width: 768px) {\n #length-unit-converter .luc-reference-grid {\n grid-template-columns: repeat(4, 1fr);\n }\n }\n #length-unit-converter .luc-reference-item {\n background: #ffffff;\n border-radius: 4px;\n padding: 8px 12px;\n border: 1px solid #e2e8f0;\n font-size: 14px;\n }\n #length-unit-converter .luc-reference-item span:first-child {\n color: #64748b;\n }\n #length-unit-converter .luc-reference-item span:last-child {\n font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Consolas, \"Liberation Mono\", Menlo, monospace;\n font-weight: 500;\n color: #1e293b;\n margin-left: 4px;\n }\n \n \/* Focus highlight for input group *\/\n #length-unit-converter .luc-input-group.focused {\n background: #eff6ff;\n margin: -8px;\n padding: 8px;\n border-radius: 4px;\n }\n #length-unit-converter .luc-input-group.focused + .luc-input-group {\n margin-top: 24px;\n }\n <\/style>\n<\/head>\n<body>\n <div id=\"length-unit-converter\">\n \n <h2 class=\"luc-title\">Calculator<\/h2>\n \n \n <div class=\"luc-container\">\n \n <div class=\"luc-grid\">\n \n <div class=\"luc-section luc-section-metric\">\n <div class=\"luc-header-metric\">\n <h3 class=\"luc-header-title\">Metric Units<\/h3>\n <\/div>\n <div class=\"luc-inputs\">\n \n <div class=\"luc-input-group\" data-group=\"mm\">\n <label for=\"luc-mm\" class=\"luc-label\">Millimeter (mm)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-mm\" data-unit=\"mm\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"mm\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"cm\">\n <label for=\"luc-cm\" class=\"luc-label\">Centimeter (cm)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-cm\" data-unit=\"cm\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"cm\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"m\">\n <label for=\"luc-m\" class=\"luc-label\">Meter (m)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-m\" data-unit=\"m\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"m\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"luc-section\">\n <div class=\"luc-header-imperial\">\n <h3 class=\"luc-header-title\">Imperial Units<\/h3>\n <\/div>\n <div class=\"luc-inputs\">\n \n <div class=\"luc-input-group\" data-group=\"in\">\n <label for=\"luc-in\" class=\"luc-label\">Inch (in)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-in\" data-unit=\"in\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"in\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"ft\">\n <label for=\"luc-ft\" class=\"luc-label\">Foot (ft)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-ft\" data-unit=\"ft\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"ft\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n \n <div class=\"luc-input-group\" data-group=\"yd\">\n <label for=\"luc-yd\" class=\"luc-label\">Yard (yd)<\/label>\n <div class=\"luc-input-wrapper\">\n <input type=\"number\" id=\"luc-yd\" data-unit=\"yd\" placeholder=\"0\" step=\"any\" class=\"luc-input\">\n <button type=\"button\" class=\"luc-copy-btn\" data-copy=\"yd\" aria-label=\"Copy value\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\"\/>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"luc-reference\">\n <h3 class=\"luc-reference-title\">\n <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\/>\n <\/svg>\n Conversion Reference\n <\/h3>\n <div class=\"luc-reference-grid\">\n <div class=\"luc-reference-item\">\n <span>1 inch =<\/span>\n <span>25.4 mm<\/span>\n <\/div>\n <div class=\"luc-reference-item\">\n <span>1 foot =<\/span>\n <span>12 inches<\/span>\n <\/div>\n <div class=\"luc-reference-item\">\n <span>1 yard =<\/span>\n <span>3 feet<\/span>\n <\/div>\n <div class=\"luc-reference-item\">\n <span>1 meter =<\/span>\n <span>1000 mm<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ Length Unit Converter - Core Logic (IIFE for isolation)\n (function() {\n 'use strict';\n\n \/\/ Conversion factors to mm (base unit)\n const TO_MM = {\n mm: 1,\n cm: 10,\n m: 1000,\n in: 25.4,\n ft: 304.8, \/\/ 12 * 25.4\n yd: 914.4 \/\/ 3 * 12 * 25.4\n };\n\n \/\/ DOM Elements\n const container = document.getElementById('length-unit-converter');\n if (!container) return;\n\n const inputs = {\n mm: container.querySelector('#luc-mm'),\n cm: container.querySelector('#luc-cm'),\n m: container.querySelector('#luc-m'),\n in: container.querySelector('#luc-in'),\n ft: container.querySelector('#luc-ft'),\n yd: container.querySelector('#luc-yd')\n };\n\n const copyButtons = container.querySelectorAll('.luc-copy-btn');\n\n \/\/ State\n const currentPrecision = 4;\n let activeInput = null;\n\n \/\/ Convert value from one unit to mm\n function toMM(value, unit) {\n return value * TO_MM[unit];\n }\n\n \/\/ Convert value from mm to target unit\n function fromMM(mm, unit) {\n return mm \/ TO_MM[unit];\n }\n\n \/\/ Format number with current precision\n function formatNumber(value) {\n if (value === 0) return '0';\n \n if (Math.abs(value) < Math.pow(10, -currentPrecision)) {\n return value.toExponential(currentPrecision);\n }\n \n const formatted = value.toFixed(currentPrecision);\n return parseFloat(formatted).toString();\n }\n\n \/\/ Update all inputs except the source\n function updateAllInputs(sourceUnit, sourceValue) {\n const mm = toMM(sourceValue, sourceUnit);\n\n Object.keys(inputs).forEach(unit => {\n if (unit !== sourceUnit && inputs[unit]) {\n const convertedValue = fromMM(mm, unit);\n inputs[unit].value = sourceValue === 0 || sourceValue === '' ? '' : formatNumber(convertedValue);\n }\n });\n }\n\n \/\/ Handle input change\n function handleInput(event) {\n const input = event.target;\n const unit = input.dataset.unit;\n const value = parseFloat(input.value) || 0;\n\n activeInput = unit;\n updateAllInputs(unit, value);\n }\n\n \/\/ Copy value to clipboard\n async function copyValue(unit) {\n const input = inputs[unit];\n if (!input) return;\n \n const value = input.value || '0';\n \n try {\n await navigator.clipboard.writeText(value);\n \n const button = container.querySelector(`[data-copy=\"${unit}\"]`);\n if (!button) return;\n \n button.classList.add('copied');\n \n const svg = button.querySelector('svg');\n const originalPath = svg.innerHTML;\n svg.innerHTML = '<path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\"\/>';\n \n setTimeout(() => {\n button.classList.remove('copied');\n svg.innerHTML = originalPath;\n }, 1500);\n } catch (err) {\n \/\/ Fallback for older browsers\n const textArea = document.createElement('textarea');\n textArea.value = value;\n textArea.style.position = 'fixed';\n textArea.style.left = '-9999px';\n document.body.appendChild(textArea);\n textArea.select();\n try {\n document.execCommand('copy');\n const button = container.querySelector(`[data-copy=\"${unit}\"]`);\n if (button) {\n button.classList.add('copied');\n setTimeout(() => button.classList.remove('copied'), 1500);\n }\n } catch (e) {\n console.error('Copy failed:', e);\n }\n document.body.removeChild(textArea);\n }\n }\n\n \/\/ Event Listeners\n Object.values(inputs).forEach(input => {\n if (!input) return;\n \n input.addEventListener('input', handleInput);\n \n input.addEventListener('focus', function() {\n const group = this.closest('.luc-input-group');\n if (group) group.classList.add('focused');\n });\n \n input.addEventListener('blur', function() {\n const group = this.closest('.luc-input-group');\n if (group) group.classList.remove('focused');\n });\n \n \/\/ Prevent scroll wheel from changing values\n input.addEventListener('wheel', function(e) {\n if (document.activeElement === this) {\n e.preventDefault();\n }\n }, { passive: false });\n });\n\n copyButtons.forEach(button => {\n button.addEventListener('click', function(e) {\n e.preventDefault();\n const unit = this.dataset.copy;\n copyValue(unit);\n });\n });\n\n })();\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Length Unit Converter is a practical online tool designed to help engineers, manufacturers, and technical professionals quickly convert between different length units with accuracy and…<\/p>","protected":false},"author":2,"featured_media":24211,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"pmpro_default_level":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[8413],"tags":[3398,8427,8429,8428],"class_list":["post-24209","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-unit-and-industry-standard-conversion","tag-engineering-tools","tag-length-conversion","tag-metric-imperial","tag-unit-converter","pmpro-has-access"],"acf":[],"jetpack_featured_media_url":"https:\/\/www.mechstream.com\/wp-content\/uploads\/2026\/02\/Length-Unit-Converter.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/posts\/24209","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/comments?post=24209"}],"version-history":[{"count":0,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/posts\/24209\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/media\/24211"}],"wp:attachment":[{"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/media?parent=24209"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/categories?post=24209"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mechstream.com\/ru\/wp-json\/wp\/v2\/tags?post=24209"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}