Force Unit Converter | Convert N, kN, kgf, lbf, kip & More<\/title>\n <meta name=\"description\" content=\"Free online Force Unit Converter for engineers and students. Instantly convert between Newton (N), Kilonewton (kN), Kilogram-force (kgf), Pound-force (lbf), Kip, and Ton-force.\" \/>\n <style>\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n \/* Reset only for calculator container to avoid global pollution *\/\n .calculator-wrapper {\n \/* Scoped Variables *\/\n --bg: #f9fafb;\n --card-bg: #ffffff;\n --text-main: #111827;\n --text-muted: #6b7280;\n --primary: #3b82f6;\n --primary-light: #eff6ff;\n --border: #e5e7eb;\n --radius: 12px;\n\n font-family: 'Inter', system-ui, -apple-system, sans-serif;\n color: var(--text-main);\n line-height: 1.5;\n width: 100%;\n max-width: 960px;\n margin: 0 auto;\n padding: 1rem;\n text-align: left; \/* Ensure left alignment default *\/\n }\n \n .calculator-wrapper * {\n box-sizing: border-box;\n }\n\n \/* Defensive Resets for Inputs\/Buttons *\/\n .calculator-wrapper input,\n .calculator-wrapper select,\n .calculator-wrapper button {\n margin: 0;\n padding: 0;\n border: none;\n background: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n box-shadow: none;\n border-radius: 0;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n \n .calculator-wrapper button {\n cursor: pointer;\n }\n\n \/* Header Section *\/\n .header {\n margin-bottom: 2rem;\n text-align: center;\n }\n \n .intro {\n font-size: 1.1rem;\n color: var(--text-muted);\n max-width: 60ch;\n margin: 0 auto;\n }\n\n \/* Top Converter Section *\/\n .converter-top {\n display: flex !important;\n align-items: flex-end;\n gap: 1rem;\n margin-bottom: 2rem;\n width: 100% !important; \/* Ensure full width *\/\n }\n\n .converter-group {\n flex: 1;\n display: flex !important;\n flex-direction: column;\n gap: 0.5rem;\n min-width: 0; \/* Allow flexing below content size *\/\n }\n\n .converter-label {\n font-size: 0.8rem;\n font-weight: 600;\n color: var(--text-muted);\n letter-spacing: 0.05em;\n text-transform: uppercase;\n }\n\n .input-row {\n display: flex !important;\n flex-direction: row !important;\n flex-wrap: nowrap !important; \/* Prevent wrapping *\/\n align-items: stretch !important;\n background-color: #fff !important;\n border: 1px solid var(--border) !important;\n border-radius: var(--radius) !important;\n padding: 0 !important;\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n transition: border-color 0.2s, box-shadow 0.2s;\n overflow: hidden !important;\n height: 56px !important;\n box-sizing: border-box !important;\n width: 100% !important;\n }\n\n .input-row:focus-within {\n border-color: var(--primary) !important;\n box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15) !important;\n }\n\n .main-input {\n display: block !important;\n border: none !important;\n outline: none !important;\n font-size: 1.5rem !important;\n font-weight: 600 !important;\n color: var(--text-main) !important;\n padding: 0 1rem !important;\n background-color: #ffffff !important;\n flex: 1 1 auto !important; \/* Allow grow and shrink, auto basis *\/\n width: 10px !important; \/* Small width to let flex grow *\/\n min-width: 50px !important; \/* Ensure visibility *\/\n max-width: 100% !important;\n height: 100% !important;\n line-height: 56px !important;\n margin: 0 !important;\n box-shadow: none !important;\n border-radius: 0 !important;\n -moz-appearance: textfield !important;\n -webkit-appearance: none !important;\n appearance: none !important;\n }\n .main-input::-webkit-outer-spin-button,\n .main-input::-webkit-inner-spin-button {\n -webkit-appearance: none !important;\n margin: 0 !important;\n }\n\n .unit-select {\n display: block !important;\n flex: 0 0 auto !important; \/* Do not grow or shrink *\/\n width: auto !important;\n max-width: 40% !important; \/* Cap width to ensure input space *\/\n border: none !important;\n border-left: 1px solid var(--border) !important;\n outline: none !important;\n background-color: #f3f4f6 !important;\n font-size: 1rem !important;\n font-weight: 600 !important;\n color: var(--text-main) !important;\n cursor: pointer !important;\n text-align: center !important;\n padding: 0 2.5rem 0 1.5rem !important;\n margin: 0 !important;\n height: 100% !important;\n min-width: 100px !important;\n line-height: 56px !important;\n border-radius: 0 !important;\n box-shadow: none !important;\n -webkit-appearance: none !important;\n appearance: none !important;\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C\/path%3E%3C\/svg%3E\") !important;\n background-repeat: no-repeat !important;\n background-position: right 0.75rem center !important;\n background-size: 1.25rem !important;\n }\n\n .unit-select:hover {\n background-color: #e5e7eb !important;\n }\n\n .swap-btn {\n flex: 0 0 auto !important;\n width: 48px !important;\n height: 48px !important;\n min-width: 48px !important;\n min-height: 48px !important;\n border-radius: 50% !important;\n border: 1px solid var(--border) !important;\n background-color: #ffffff !important;\n cursor: pointer !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n margin-bottom: 4px !important;\n transition: all 0.2s;\n transform: rotate(90deg);\n padding: 0 !important;\n position: relative !important;\n z-index: 20 !important;\n box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;\n visibility: visible !important;\n opacity: 1 !important;\n \/* Icon Background *\/\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 16V4M7 4L3 8M7 4L11 8M17 8V20M17 20L21 16M17 20L13 16'\/%3E%3C\/svg%3E\") !important;\n background-repeat: no-repeat !important;\n background-position: center !important;\n background-size: 24px !important;\n }\n\n .swap-btn:hover {\n background-color: var(--bg) !important;\n border-color: var(--primary) !important;\n \/* Change icon color on hover by swapping SVG stroke color in Data URI *\/\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 24 24' stroke='%233b82f6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 16V4M7 4L3 8M7 4L11 8M17 8V20M17 20L21 16M17 20L13 16'\/%3E%3C\/svg%3E\") !important;\n }\n\n \/* Result Banner *\/\n .result-banner {\n background: var(--primary-light);\n border: 1px solid #dbeafe;\n border-radius: var(--radius);\n padding: 1.5rem;\n text-align: center;\n margin-bottom: 3rem;\n color: var(--primary);\n font-size: 1.5rem;\n }\n\n .result-banner .val {\n font-weight: 700;\n color: #1e3a8a;\n }\n \n .result-banner .unit {\n color: #3b82f6;\n font-weight: 500;\n }\n \n .result-banner .eq {\n color: #9ca3af;\n margin: 0 0.5rem;\n }\n\n \/* Bottom Cards Grid *\/\n .section-header {\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--text-main);\n margin-bottom: 1rem;\n }\n\n .cards-grid {\n display: grid !important;\n grid-template-columns: repeat(3, 1fr) !important; \/* Force 3 columns on desktop *\/\n gap: 1rem !important;\n margin-bottom: 2.5rem !important;\n }\n\n .unit-card {\n background: #fff !important;\n border: 1px solid var(--border) !important;\n border-radius: var(--radius) !important;\n padding: 1rem !important;\n box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;\n display: flex !important;\n flex-direction: column !important;\n gap: 0.25rem !important;\n position: relative !important;\n box-sizing: border-box !important;\n min-height: 0 !important;\n }\n\n \/* Removed hover\/copy interactions as requested *\/\n \n .card-label {\n font-size: 0.75rem !important;\n font-weight: 600 !important;\n color: var(--text-muted) !important;\n text-transform: uppercase !important;\n letter-spacing: 0.05em !important;\n margin-bottom: 0.1rem !important;\n }\n\n .card-value-row {\n display: flex !important;\n align-items: baseline !important;\n gap: 0.35rem !important;\n flex-wrap: wrap !important;\n }\n\n .card-value {\n font-size: 1.25rem !important;\n font-weight: 700 !important;\n color: #111827 !important;\n white-space: normal !important;\n word-break: break-all !important;\n line-height: 1.2 !important;\n }\n\n .card-unit {\n font-size: 0.85rem !important;\n color: #6b7280 !important;\n font-weight: 500 !important;\n display: block !important;\n }\n\n \/* Content & SEO Section Styles *\/\n .content-section {\n margin-bottom: 3rem;\n }\n\n .content-title {\n font-size: 1.75rem;\n font-weight: 700;\n color: #111827;\n margin-bottom: 1.5rem;\n text-align: center;\n }\n\n .content-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2rem;\n }\n\n .text-card {\n background: var(--card-bg);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 2rem;\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n }\n\n .text-card h3 {\n font-size: 1.25rem;\n font-weight: 600;\n margin-bottom: 1rem;\n color: #111827;\n }\n\n .text-card p {\n margin-bottom: 1rem;\n color: #4b5563;\n font-size: 0.95rem;\n }\n\n .text-card p:last-child {\n margin-bottom: 0;\n }\n\n \/* Formula Table *\/\n .table-container {\n overflow-x: auto;\n background: #fff;\n border-radius: var(--radius);\n border: 1px solid var(--border);\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n margin-bottom: 2rem;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.95rem;\n min-width: 600px;\n }\n\n th, td {\n padding: 1rem 1.5rem;\n text-align: left;\n border-bottom: 1px solid var(--border);\n }\n\n th {\n background-color: #f9fafb;\n font-weight: 600;\n color: #374151;\n text-transform: uppercase;\n font-size: 0.8rem;\n letter-spacing: 0.05em;\n }\n\n tr:last-child td {\n border-bottom: none;\n }\n \n tr:hover td {\n background-color: #f9fafb;\n }\n\n \/* FAQ Section *\/\n .faq-list {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n }\n\n .faq-item {\n padding-bottom: 1rem;\n border-bottom: 1px solid var(--border);\n }\n \n .faq-item:last-child {\n border-bottom: none;\n padding-bottom: 0;\n }\n\n .faq-item h4 {\n font-size: 1rem;\n font-weight: 600;\n color: #111827;\n margin-bottom: 0.5rem;\n }\n\n .faq-item p {\n font-size: 0.9rem;\n color: #6b7280;\n line-height: 1.5;\n margin: 0;\n }\n\n \/* Quick Stats \/ Sidebar styled as cards *\/\n .quick-list {\n list-style: none;\n padding: 0;\n }\n\n .quick-list li {\n display: flex;\n justify-content: space-between;\n padding: 0.75rem 0;\n border-bottom: 1px solid #f3f4f6;\n font-size: 0.95rem;\n color: #4b5563;\n }\n\n .quick-list li:last-child {\n border-bottom: none;\n }\n\n .quick-list strong {\n color: var(--primary);\n }\n\n .tags {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n }\n\n .tag {\n background: #eff6ff;\n color: #2563eb;\n padding: 0.25rem 0.75rem;\n border-radius: 9999px;\n font-size: 0.8rem;\n font-weight: 500;\n }\n\n @media (max-width: 768px) {\n .calculator-wrapper {\n padding: 1rem; \/* Restore padding for consistent alignment *\/\n }\n\n .converter-top {\n flex-direction: column;\n align-items: stretch !important; \/* Full width inputs *\/\n gap: 1.25rem;\n }\n \n .converter-group {\n width: 100%;\n }\n \n .swap-btn {\n align-self: center !important;\n transform: rotate(0deg) !important; \/* Vertical for mobile *\/\n margin: -12px 0 !important; \/* Tighter stacking with negative margin *\/\n z-index: 20 !important;\n }\n\n .content-grid {\n grid-template-columns: 1fr;\n }\n\n .result-banner {\n font-size: 1.2rem;\n padding: 1.25rem;\n }\n\n .cards-grid {\n grid-template-columns: 1fr !important; \/* Stack cards on mobile - Force 1 column override *\/\n gap: 1rem !important;\n }\n \n .card-value {\n font-size: 1.25rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"calculator-wrapper\">\n <header class=\"header\">\n <p class=\"intro\">\n Precision engineering calculator for converting force units. Instantly switch between Metric (N, kN, MN) and Imperial (lbf, kip, ton) standards with real-time accuracy.\n <\/p>\n <\/header>\n\n \n <div class=\"converter-top\">\n <div class=\"converter-group\">\n <label class=\"converter-label\">Value<\/label>\n <div class=\"input-row\">\n <input type=\"number\" id=\"main-input\" class=\"main-input\" value=\"1\" placeholder=\"Enter value\">\n <select id=\"source-unit\" class=\"unit-select\"><\/select>\n <\/div>\n <\/div>\n\n <button id=\"swap-btn\" class=\"swap-btn\" title=\"Swap Units\"><\/button>\n\n <div class=\"converter-group\">\n <label class=\"converter-label\">Result<\/label>\n <div class=\"input-row\">\n <input type=\"number\" id=\"main-output\" class=\"main-input\" placeholder=\"Result\">\n <select id=\"target-unit\" class=\"unit-select\"><\/select>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"result-banner\" class=\"result-banner\">\n \n <span class=\"val\" id=\"banner-source-val\">1<\/span> \n <span class=\"unit\" id=\"banner-source-unit\">kN<\/span>\n <span class=\"eq\">=<\/span>\n <span class=\"val\" id=\"banner-target-val\">1000<\/span>\n <span class=\"unit\" id=\"banner-target-unit\">N<\/span>\n <\/div>\n\n \n <h2 class=\"section-header\">Metric Units (SI)<\/h2>\n <div class=\"cards-grid\" id=\"metric-cards\"><\/div>\n\n <h2 class=\"section-header\">Imperial \/ US Units<\/h2>\n <div class=\"cards-grid\" id=\"imperial-cards\"><\/div>\n\n\n \n <section class=\"content-section\" style=\"margin-top: 4rem;\">\n <div class=\"text-card\" style=\"margin-bottom: 2rem;\">\n <h3>How Force Unit Conversion Works<\/h3>\n <p>\n Force is a vector quantity that causes an object with mass to change its velocity. In engineering contexts, particularly civil and mechanical design, accurately converting between the International System of Units (SI) and Imperial units is critical.\n <\/p>\n <p>\n This calculator uses the <strong>Kilonewton (kN)<\/strong> as its internal base unit. All inputs are first normalized to kN and then distributed to other fields using standard gravitational constants. This method ensures that rounding errors are minimized, providing 6-decimal precision for factor calculations while displaying user-friendly formatted results.\n <\/p>\n <\/div>\n\n <h3 class=\"content-title\" style=\"text-align: left; font-size: 1.25rem; margin-bottom: 1rem;\">Common Conversion Formulas<\/h3>\n <div class=\"table-container\">\n <table>\n <thead>\n <tr>\n <th>Target Unit<\/th>\n <th>Symbol<\/th>\n <th>Formula (from kN)<\/th>\n <th>Example (10 kN)<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td>Newton<\/td>\n <td>N<\/td>\n <td>1 kN = 1,000 N<\/td>\n <td>10,000 N<\/td>\n <\/tr>\n <tr>\n <td>Kilogram-force<\/td>\n <td>kgf<\/td>\n <td>1 kN \u2248 101.97 kgf<\/td>\n <td>1,019.7 kgf<\/td>\n <\/tr>\n <tr>\n <td>Pound-force<\/td>\n <td>lbf<\/td>\n <td>1 kN \u2248 224.81 lbf<\/td>\n <td>2,248.1 lbf<\/td>\n <\/tr>\n <tr>\n <td>Kip (Kilopound)<\/td>\n <td>kip<\/td>\n <td>1 kN \u2248 0.2248 kip<\/td>\n <td>2.248 kip<\/td>\n <\/tr>\n <tr>\n <td>Metric Ton-force<\/td>\n <td>tf<\/td>\n <td>1 kN \u2248 0.102 tf<\/td>\n <td>1.02 tf<\/td>\n <\/tr>\n <tr>\n <td>US Ton-force<\/td>\n <td>short tonf<\/td>\n <td>1 kN \u2248 0.1124 tonf<\/td>\n <td>1.124 tonf<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/section>\n\n \n <section class=\"content-grid\">\n \n <div class=\"text-card\">\n <h3>Frequently Asked Questions<\/h3>\n <div class=\"faq-list\">\n <div class=\"faq-item\">\n <h4>Difference between kg and kgf?<\/h4>\n <p><strong>kg<\/strong> is mass; <strong>kgf<\/strong> is force. 1 kgf is the force gravity exerts on 1 kg mass. They are numerically similar but physically distinct.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>How to convert kN to kg?<\/h4>\n <p>Multiply kN by ~101.97 to get the equivalent mass in kg supported under standard gravity.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>What is a Kip?<\/h4>\n <p>“Kilo-pound” (1,000 lbf). Used in the US for structural loads to avoid large numbers.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>Is 1 kN = 100 kg?<\/h4>\n <p>Roughly. 1 kN \u2248 101.97 kgf. Engineers often use the “divide by 10” rule for quick estimates.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>Difference between Ton and Ton-force?<\/h4>\n <p><strong>Ton<\/strong> usually refers to mass (metric ton = 1000 kg), while <strong>Ton-force<\/strong> is the gravitational force exerted by that mass. Context is key in engineering specs.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"display: flex; flex-direction: column; gap: 2rem;\">\n <div class=\"text-card\">\n <h3>\ud83d\ude80 Quick Reference<\/h3>\n <ul class=\"quick-list\">\n <li><span>1 kN<\/span> <strong>1000 N<\/strong><\/li>\n <li><span>1 kN<\/span> <strong>224.8 lbf<\/strong><\/li>\n <li><span>1 kip<\/span> <strong>4.448 kN<\/strong><\/li>\n <li><span>1 kgf<\/span> <strong>9.807 N<\/strong><\/li>\n <li><span>1 US tonf<\/span> <strong>2000 lbf<\/strong><\/li>\n <\/ul>\n <\/div>\n\n <div class=\"text-card\">\n <h3>\ud83d\udcc2 Popular Searches<\/h3>\n <p style=\"font-size: 0.9rem; margin-bottom: 0.75rem;\">Common conversions engineers look for:<\/p>\n <div class=\"tags\">\n <span class=\"tag\">kN to T<\/span>\n <span class=\"tag\">kg to N<\/span>\n <span class=\"tag\">kn to lbf<\/span>\n <span class=\"tag\">Tonnage to kN<\/span>\n <span class=\"tag\">ton-force to kN<\/span>\n <span class=\"tag\">Force Converter<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <\/div>\n\n <script>\n (function() {\n \/\/ Use a unique prefix or IIFE to avoid global scope pollution in WordPress\n \n \/**\n * Units Data\n * 1 kN = factor * Unit\n *\/\n const calculatorUnits = [\n \/\/ Metric\n { id: 'n', name: 'Newton', symbol: 'N', type: 'metric', ratioFromKN: 1000 },\n { id: 'kn', name: 'Kilonewton', symbol: 'kN', type: 'metric', ratioFromKN: 1 },\n { id: 'mn', name: 'Meganewton', symbol: 'MN', type: 'metric', ratioFromKN: 0.001 },\n { id: 'T', name: 'Metric ton-force', symbol: 'T', type: 'metric', ratioFromKN: 0.1019716 },\n { id: 'gf', name: 'Gram-force', symbol: 'gf', type: 'metric', ratioFromKN: 101971.62 },\n { id: 'kgf', name: 'Kilogram-force', symbol: 'kgf', type: 'metric', ratioFromKN: 101.9716 },\n \n \/\/ Imperial\n { id: 'lbf', name: 'Pound-force', symbol: 'lbf', type: 'imperial', ratioFromKN: 224.808943 },\n { id: 'kip', name: 'Kilopound-force', symbol: 'kip', type: 'imperial', ratioFromKN: 0.224808943 },\n { id: 'short_tonf', name: 'US ton-force', symbol: 'short tonf', type: 'imperial', ratioFromKN: 0.1124045 },\n { id: 'long_tonf', name: 'UK ton-force', symbol: 'long tonf', type: 'imperial', ratioFromKN: 0.100361 }\n ];\n\n \/\/ DOM Elements\n let mainInput, mainOutput, sourceSelect, targetSelect, swapBtn;\n let bannerSourceVal, bannerSourceUnit, bannerTargetVal, bannerTargetUnit;\n let metricCardsContainer, imperialCardsContainer;\n\n \/\/ State\n let state = {\n val: 1,\n sourceId: 'kn',\n targetId: 'n'\n };\n\n \/\/ Helper: Smart Format\n function smartFormat(num) {\n if (!isFinite(num)) return '';\n const abs = Math.abs(num);\n \n \/\/ Integer check\n if (Math.abs(num - Math.round(num)) < 1e-9) {\n \/\/ If it's huge, use scientific\n if (abs > 1e6) return num.toExponential(4).replace('+', '');\n return num.toFixed(0);\n }\n \n \/\/ Very small or very large -> scientific\n if (abs < 1e-3 || abs > 1e6) {\n return num.toExponential(4).replace('+', '');\n }\n \n \/\/ Standard decimal\n return parseFloat(num.toFixed(4)).toString();\n }\n\n \/\/ Init Logic\n function init() {\n \/\/ Get Elements safely\n const getEl = (id) => document.getElementById(id);\n \n mainInput = getEl('main-input');\n mainOutput = getEl('main-output');\n sourceSelect = getEl('source-unit');\n targetSelect = getEl('target-unit');\n swapBtn = getEl('swap-btn');\n \n bannerSourceVal = getEl('banner-source-val');\n bannerSourceUnit = getEl('banner-source-unit');\n bannerTargetVal = getEl('banner-target-val');\n bannerTargetUnit = getEl('banner-target-unit');\n \n metricCardsContainer = getEl('metric-cards');\n imperialCardsContainer = getEl('imperial-cards');\n\n if (!mainInput || !metricCardsContainer) {\n console.error('Calculator elements not found');\n return;\n }\n\n \/\/ Populate Selects\n calculatorUnits.forEach(u => {\n const opt1 = document.createElement('option');\n opt1.value = u.id;\n opt1.textContent = u.symbol;\n sourceSelect.appendChild(opt1);\n\n const opt2 = document.createElement('option');\n opt2.value = u.id;\n opt2.textContent = u.symbol;\n targetSelect.appendChild(opt2);\n });\n\n \/\/ Set Defaults\n sourceSelect.value = state.sourceId;\n targetSelect.value = state.targetId;\n\n \/\/ Render Empty Cards\n renderCards();\n\n \/\/ Calc Initial\n calculate();\n\n \/\/ Listeners\n mainInput.addEventListener('input', (e) => {\n const raw = parseFloat(e.target.value);\n state.val = isNaN(raw) ? NaN : raw;\n calculate('input');\n });\n\n mainOutput.addEventListener('input', (e) => {\n const raw = parseFloat(e.target.value);\n if (isNaN(raw)) {\n state.val = NaN;\n } else {\n \/\/ Reverse calc: Output -> Base (kN) -> Input\n const targetUnit = calculatorUnits.find(u => u.id === state.targetId);\n const sourceUnit = calculatorUnits.find(u => u.id === state.sourceId);\n const valInKN = raw \/ targetUnit.ratioFromKN;\n state.val = valInKN * sourceUnit.ratioFromKN;\n }\n calculate('output');\n });\n\n sourceSelect.addEventListener('change', (e) => {\n state.sourceId = e.target.value;\n calculate('input'); \/\/ Treat as input side change\n });\n\n targetSelect.addEventListener('change', (e) => {\n state.targetId = e.target.value;\n calculate('input'); \/\/ Preserve input val, recalc output\n });\n\n swapBtn.addEventListener('click', () => {\n \/\/ Swap IDs\n const tempId = state.sourceId;\n state.sourceId = state.targetId;\n state.targetId = tempId;\n \n \/\/ Update Selects\n sourceSelect.value = state.sourceId;\n targetSelect.value = state.targetId;\n \n \/\/ Recalculate (preserve numerical value of input field)\n calculate('input');\n });\n }\n\n function renderCards() {\n metricCardsContainer.innerHTML = '';\n imperialCardsContainer.innerHTML = '';\n\n calculatorUnits.forEach(u => {\n const card = document.createElement('div');\n card.className = 'unit-card';\n \n card.innerHTML = `\n <div class=\"card-label\">${u.name}<\/div>\n <div class=\"card-value-row\">\n <span class=\"card-value\" id=\"card-val-${u.id}\">-<\/span>\n <span class=\"card-unit\">${u.symbol}<\/span>\n <\/div>\n `;\n\n if (u.type === 'metric') {\n metricCardsContainer.appendChild(card);\n } else {\n imperialCardsContainer.appendChild(card);\n }\n });\n }\n\n function calculate(origin) {\n const sourceUnit = calculatorUnits.find(u => u.id === state.sourceId);\n const targetUnit = calculatorUnits.find(u => u.id === state.targetId);\n \n const inputVal = isNaN(state.val) ? 0 : state.val;\n \n \/\/ 1. Convert Input -> Base (kN)\n const valInKN = isNaN(state.val) ? 0 : state.val \/ sourceUnit.ratioFromKN;\n\n \/\/ 2. Convert Base -> Target\n const targetResult = valInKN * targetUnit.ratioFromKN;\n\n \/\/ Update DOM\n \/\/ Only update Input if change came from Output\n if (origin === 'output') {\n mainInput.value = isNaN(state.val) ? '' : smartFormat(state.val);\n }\n \n \/\/ Only update Output if change came from Input (or other controls)\n if (origin !== 'output') {\n mainOutput.value = isNaN(state.val) ? '' : smartFormat(targetResult);\n }\n\n \/\/ Update Banner\n if (isNaN(state.val)) {\n bannerSourceVal.textContent = '-';\n bannerTargetVal.textContent = '-';\n } else {\n \/\/ Ensure we show formatted values in banner\n const formattedSource = origin === 'output' ? smartFormat(state.val) : (origin === 'input' && mainInput.value ? mainInput.value : smartFormat(state.val));\n const formattedTarget = origin !== 'output' ? smartFormat(targetResult) : (mainOutput.value ? mainOutput.value : smartFormat(targetResult));\n \n bannerSourceVal.textContent = formattedSource;\n bannerSourceUnit.textContent = sourceUnit.symbol;\n bannerTargetVal.textContent = formattedTarget;\n bannerTargetUnit.textContent = targetUnit.symbol;\n }\n\n \/\/ Update All Cards\n calculatorUnits.forEach(u => {\n const el = document.getElementById(`card-val-${u.id}`);\n if (!el) return;\n \n if (isNaN(state.val)) {\n el.textContent = '-';\n } else {\n const res = valInKN * u.ratioFromKN;\n el.textContent = smartFormat(res);\n }\n });\n }\n\n \/\/ Run when DOM is ready\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', init);\n } else {\n init();\n }\n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Force Unit Converter | Convert N, kN, kgf, lbf, kip & More Precision engineering calculator for converting force units. Instantly<\/p>","protected":false},"author":1,"featured_media":74288,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-74216","page","type-page","status-publish","has-post-thumbnail","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/pages\/74216","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/comments?post=74216"}],"version-history":[{"count":0,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/pages\/74216\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/media\/74288"}],"wp:attachment":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/media?parent=74216"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":74216,"date":"2025-12-06T06:35:02","date_gmt":"2025-12-06T06:35:02","guid":{"rendered":"https:\/\/www.harsle.com\/?page_id=74216"},"modified":"2025-12-08T02:02:56","modified_gmt":"2025-12-08T02:02:56","slug":"force-unit-converter","status":"publish","type":"page","link":"https:\/\/www.harsle.com\/pt\/force-unit-converter\/","title":{"rendered":"Conversor de Unidades de For\u00e7a"},"content":{"rendered":"\n\n\n\n \n \n Force Unit Converter | Convert N, kN, kgf, lbf, kip & More<\/title>\n <meta name=\"description\" content=\"Free online Force Unit Converter for engineers and students. Instantly convert between Newton (N), Kilonewton (kN), Kilogram-force (kgf), Pound-force (lbf), Kip, and Ton-force.\" \/>\n <style>\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n \/* Reset only for calculator container to avoid global pollution *\/\n .calculator-wrapper {\n \/* Scoped Variables *\/\n --bg: #f9fafb;\n --card-bg: #ffffff;\n --text-main: #111827;\n --text-muted: #6b7280;\n --primary: #3b82f6;\n --primary-light: #eff6ff;\n --border: #e5e7eb;\n --radius: 12px;\n\n font-family: 'Inter', system-ui, -apple-system, sans-serif;\n color: var(--text-main);\n line-height: 1.5;\n width: 100%;\n max-width: 960px;\n margin: 0 auto;\n padding: 1rem;\n text-align: left; \/* Ensure left alignment default *\/\n }\n \n .calculator-wrapper * {\n box-sizing: border-box;\n }\n\n \/* Defensive Resets for Inputs\/Buttons *\/\n .calculator-wrapper input,\n .calculator-wrapper select,\n .calculator-wrapper button {\n margin: 0;\n padding: 0;\n border: none;\n background: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n box-shadow: none;\n border-radius: 0;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n \n .calculator-wrapper button {\n cursor: pointer;\n }\n\n \/* Header Section *\/\n .header {\n margin-bottom: 2rem;\n text-align: center;\n }\n \n .intro {\n font-size: 1.1rem;\n color: var(--text-muted);\n max-width: 60ch;\n margin: 0 auto;\n }\n\n \/* Top Converter Section *\/\n .converter-top {\n display: flex !important;\n align-items: flex-end;\n gap: 1rem;\n margin-bottom: 2rem;\n width: 100% !important; \/* Ensure full width *\/\n }\n\n .converter-group {\n flex: 1;\n display: flex !important;\n flex-direction: column;\n gap: 0.5rem;\n min-width: 0; \/* Allow flexing below content size *\/\n }\n\n .converter-label {\n font-size: 0.8rem;\n font-weight: 600;\n color: var(--text-muted);\n letter-spacing: 0.05em;\n text-transform: uppercase;\n }\n\n .input-row {\n display: flex !important;\n flex-direction: row !important;\n flex-wrap: nowrap !important; \/* Prevent wrapping *\/\n align-items: stretch !important;\n background-color: #fff !important;\n border: 1px solid var(--border) !important;\n border-radius: var(--radius) !important;\n padding: 0 !important;\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n transition: border-color 0.2s, box-shadow 0.2s;\n overflow: hidden !important;\n height: 56px !important;\n box-sizing: border-box !important;\n width: 100% !important;\n }\n\n .input-row:focus-within {\n border-color: var(--primary) !important;\n box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15) !important;\n }\n\n .main-input {\n display: block !important;\n border: none !important;\n outline: none !important;\n font-size: 1.5rem !important;\n font-weight: 600 !important;\n color: var(--text-main) !important;\n padding: 0 1rem !important;\n background-color: #ffffff !important;\n flex: 1 1 auto !important; \/* Allow grow and shrink, auto basis *\/\n width: 10px !important; \/* Small width to let flex grow *\/\n min-width: 50px !important; \/* Ensure visibility *\/\n max-width: 100% !important;\n height: 100% !important;\n line-height: 56px !important;\n margin: 0 !important;\n box-shadow: none !important;\n border-radius: 0 !important;\n -moz-appearance: textfield !important;\n -webkit-appearance: none !important;\n appearance: none !important;\n }\n .main-input::-webkit-outer-spin-button,\n .main-input::-webkit-inner-spin-button {\n -webkit-appearance: none !important;\n margin: 0 !important;\n }\n\n .unit-select {\n display: block !important;\n flex: 0 0 auto !important; \/* Do not grow or shrink *\/\n width: auto !important;\n max-width: 40% !important; \/* Cap width to ensure input space *\/\n border: none !important;\n border-left: 1px solid var(--border) !important;\n outline: none !important;\n background-color: #f3f4f6 !important;\n font-size: 1rem !important;\n font-weight: 600 !important;\n color: var(--text-main) !important;\n cursor: pointer !important;\n text-align: center !important;\n padding: 0 2.5rem 0 1.5rem !important;\n margin: 0 !important;\n height: 100% !important;\n min-width: 100px !important;\n line-height: 56px !important;\n border-radius: 0 !important;\n box-shadow: none !important;\n -webkit-appearance: none !important;\n appearance: none !important;\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C\/path%3E%3C\/svg%3E\") !important;\n background-repeat: no-repeat !important;\n background-position: right 0.75rem center !important;\n background-size: 1.25rem !important;\n }\n\n .unit-select:hover {\n background-color: #e5e7eb !important;\n }\n\n .swap-btn {\n flex: 0 0 auto !important;\n width: 48px !important;\n height: 48px !important;\n min-width: 48px !important;\n min-height: 48px !important;\n border-radius: 50% !important;\n border: 1px solid var(--border) !important;\n background-color: #ffffff !important;\n cursor: pointer !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n margin-bottom: 4px !important;\n transition: all 0.2s;\n transform: rotate(90deg);\n padding: 0 !important;\n position: relative !important;\n z-index: 20 !important;\n box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;\n visibility: visible !important;\n opacity: 1 !important;\n \/* Icon Background *\/\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 16V4M7 4L3 8M7 4L11 8M17 8V20M17 20L21 16M17 20L13 16'\/%3E%3C\/svg%3E\") !important;\n background-repeat: no-repeat !important;\n background-position: center !important;\n background-size: 24px !important;\n }\n\n .swap-btn:hover {\n background-color: var(--bg) !important;\n border-color: var(--primary) !important;\n \/* Change icon color on hover by swapping SVG stroke color in Data URI *\/\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 24 24' stroke='%233b82f6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 16V4M7 4L3 8M7 4L11 8M17 8V20M17 20L21 16M17 20L13 16'\/%3E%3C\/svg%3E\") !important;\n }\n\n \/* Result Banner *\/\n .result-banner {\n background: var(--primary-light);\n border: 1px solid #dbeafe;\n border-radius: var(--radius);\n padding: 1.5rem;\n text-align: center;\n margin-bottom: 3rem;\n color: var(--primary);\n font-size: 1.5rem;\n }\n\n .result-banner .val {\n font-weight: 700;\n color: #1e3a8a;\n }\n \n .result-banner .unit {\n color: #3b82f6;\n font-weight: 500;\n }\n \n .result-banner .eq {\n color: #9ca3af;\n margin: 0 0.5rem;\n }\n\n \/* Bottom Cards Grid *\/\n .section-header {\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--text-main);\n margin-bottom: 1rem;\n }\n\n .cards-grid {\n display: grid !important;\n grid-template-columns: repeat(3, 1fr) !important; \/* Force 3 columns on desktop *\/\n gap: 1rem !important;\n margin-bottom: 2.5rem !important;\n }\n\n .unit-card {\n background: #fff !important;\n border: 1px solid var(--border) !important;\n border-radius: var(--radius) !important;\n padding: 1rem !important;\n box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;\n display: flex !important;\n flex-direction: column !important;\n gap: 0.25rem !important;\n position: relative !important;\n box-sizing: border-box !important;\n min-height: 0 !important;\n }\n\n \/* Removed hover\/copy interactions as requested *\/\n \n .card-label {\n font-size: 0.75rem !important;\n font-weight: 600 !important;\n color: var(--text-muted) !important;\n text-transform: uppercase !important;\n letter-spacing: 0.05em !important;\n margin-bottom: 0.1rem !important;\n }\n\n .card-value-row {\n display: flex !important;\n align-items: baseline !important;\n gap: 0.35rem !important;\n flex-wrap: wrap !important;\n }\n\n .card-value {\n font-size: 1.25rem !important;\n font-weight: 700 !important;\n color: #111827 !important;\n white-space: normal !important;\n word-break: break-all !important;\n line-height: 1.2 !important;\n }\n\n .card-unit {\n font-size: 0.85rem !important;\n color: #6b7280 !important;\n font-weight: 500 !important;\n display: block !important;\n }\n\n \/* Content & SEO Section Styles *\/\n .content-section {\n margin-bottom: 3rem;\n }\n\n .content-title {\n font-size: 1.75rem;\n font-weight: 700;\n color: #111827;\n margin-bottom: 1.5rem;\n text-align: center;\n }\n\n .content-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2rem;\n }\n\n .text-card {\n background: var(--card-bg);\n border: 1px solid var(--border);\n border-radius: var(--radius);\n padding: 2rem;\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n }\n\n .text-card h3 {\n font-size: 1.25rem;\n font-weight: 600;\n margin-bottom: 1rem;\n color: #111827;\n }\n\n .text-card p {\n margin-bottom: 1rem;\n color: #4b5563;\n font-size: 0.95rem;\n }\n\n .text-card p:last-child {\n margin-bottom: 0;\n }\n\n \/* Formula Table *\/\n .table-container {\n overflow-x: auto;\n background: #fff;\n border-radius: var(--radius);\n border: 1px solid var(--border);\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n margin-bottom: 2rem;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.95rem;\n min-width: 600px;\n }\n\n th, td {\n padding: 1rem 1.5rem;\n text-align: left;\n border-bottom: 1px solid var(--border);\n }\n\n th {\n background-color: #f9fafb;\n font-weight: 600;\n color: #374151;\n text-transform: uppercase;\n font-size: 0.8rem;\n letter-spacing: 0.05em;\n }\n\n tr:last-child td {\n border-bottom: none;\n }\n \n tr:hover td {\n background-color: #f9fafb;\n }\n\n \/* FAQ Section *\/\n .faq-list {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n }\n\n .faq-item {\n padding-bottom: 1rem;\n border-bottom: 1px solid var(--border);\n }\n \n .faq-item:last-child {\n border-bottom: none;\n padding-bottom: 0;\n }\n\n .faq-item h4 {\n font-size: 1rem;\n font-weight: 600;\n color: #111827;\n margin-bottom: 0.5rem;\n }\n\n .faq-item p {\n font-size: 0.9rem;\n color: #6b7280;\n line-height: 1.5;\n margin: 0;\n }\n\n \/* Quick Stats \/ Sidebar styled as cards *\/\n .quick-list {\n list-style: none;\n padding: 0;\n }\n\n .quick-list li {\n display: flex;\n justify-content: space-between;\n padding: 0.75rem 0;\n border-bottom: 1px solid #f3f4f6;\n font-size: 0.95rem;\n color: #4b5563;\n }\n\n .quick-list li:last-child {\n border-bottom: none;\n }\n\n .quick-list strong {\n color: var(--primary);\n }\n\n .tags {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n }\n\n .tag {\n background: #eff6ff;\n color: #2563eb;\n padding: 0.25rem 0.75rem;\n border-radius: 9999px;\n font-size: 0.8rem;\n font-weight: 500;\n }\n\n @media (max-width: 768px) {\n .calculator-wrapper {\n padding: 1rem; \/* Restore padding for consistent alignment *\/\n }\n\n .converter-top {\n flex-direction: column;\n align-items: stretch !important; \/* Full width inputs *\/\n gap: 1.25rem;\n }\n \n .converter-group {\n width: 100%;\n }\n \n .swap-btn {\n align-self: center !important;\n transform: rotate(0deg) !important; \/* Vertical for mobile *\/\n margin: -12px 0 !important; \/* Tighter stacking with negative margin *\/\n z-index: 20 !important;\n }\n\n .content-grid {\n grid-template-columns: 1fr;\n }\n\n .result-banner {\n font-size: 1.2rem;\n padding: 1.25rem;\n }\n\n .cards-grid {\n grid-template-columns: 1fr !important; \/* Stack cards on mobile - Force 1 column override *\/\n gap: 1rem !important;\n }\n \n .card-value {\n font-size: 1.25rem;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"calculator-wrapper\">\n <header class=\"header\">\n <p class=\"intro\">\n Precision engineering calculator for converting force units. Instantly switch between Metric (N, kN, MN) and Imperial (lbf, kip, ton) standards with real-time accuracy.\n <\/p>\n <\/header>\n\n \n <div class=\"converter-top\">\n <div class=\"converter-group\">\n <label class=\"converter-label\">Value<\/label>\n <div class=\"input-row\">\n <input type=\"number\" id=\"main-input\" class=\"main-input\" value=\"1\" placeholder=\"Enter value\">\n <select id=\"source-unit\" class=\"unit-select\"><\/select>\n <\/div>\n <\/div>\n\n <button id=\"swap-btn\" class=\"swap-btn\" title=\"Swap Units\"><\/button>\n\n <div class=\"converter-group\">\n <label class=\"converter-label\">Result<\/label>\n <div class=\"input-row\">\n <input type=\"number\" id=\"main-output\" class=\"main-input\" placeholder=\"Result\">\n <select id=\"target-unit\" class=\"unit-select\"><\/select>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"result-banner\" class=\"result-banner\">\n \n <span class=\"val\" id=\"banner-source-val\">1<\/span> \n <span class=\"unit\" id=\"banner-source-unit\">kN<\/span>\n <span class=\"eq\">=<\/span>\n <span class=\"val\" id=\"banner-target-val\">1000<\/span>\n <span class=\"unit\" id=\"banner-target-unit\">N<\/span>\n <\/div>\n\n \n <h2 class=\"section-header\">Metric Units (SI)<\/h2>\n <div class=\"cards-grid\" id=\"metric-cards\"><\/div>\n\n <h2 class=\"section-header\">Imperial \/ US Units<\/h2>\n <div class=\"cards-grid\" id=\"imperial-cards\"><\/div>\n\n\n \n <section class=\"content-section\" style=\"margin-top: 4rem;\">\n <div class=\"text-card\" style=\"margin-bottom: 2rem;\">\n <h3>How Force Unit Conversion Works<\/h3>\n <p>\n Force is a vector quantity that causes an object with mass to change its velocity. In engineering contexts, particularly civil and mechanical design, accurately converting between the International System of Units (SI) and Imperial units is critical.\n <\/p>\n <p>\n This calculator uses the <strong>Kilonewton (kN)<\/strong> as its internal base unit. All inputs are first normalized to kN and then distributed to other fields using standard gravitational constants. This method ensures that rounding errors are minimized, providing 6-decimal precision for factor calculations while displaying user-friendly formatted results.\n <\/p>\n <\/div>\n\n <h3 class=\"content-title\" style=\"text-align: left; font-size: 1.25rem; margin-bottom: 1rem;\">Common Conversion Formulas<\/h3>\n <div class=\"table-container\">\n <table>\n <thead>\n <tr>\n <th>Target Unit<\/th>\n <th>Symbol<\/th>\n <th>Formula (from kN)<\/th>\n <th>Example (10 kN)<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td>Newton<\/td>\n <td>N<\/td>\n <td>1 kN = 1,000 N<\/td>\n <td>10,000 N<\/td>\n <\/tr>\n <tr>\n <td>Kilogram-force<\/td>\n <td>kgf<\/td>\n <td>1 kN \u2248 101.97 kgf<\/td>\n <td>1,019.7 kgf<\/td>\n <\/tr>\n <tr>\n <td>Pound-force<\/td>\n <td>lbf<\/td>\n <td>1 kN \u2248 224.81 lbf<\/td>\n <td>2,248.1 lbf<\/td>\n <\/tr>\n <tr>\n <td>Kip (Kilopound)<\/td>\n <td>kip<\/td>\n <td>1 kN \u2248 0.2248 kip<\/td>\n <td>2.248 kip<\/td>\n <\/tr>\n <tr>\n <td>Metric Ton-force<\/td>\n <td>tf<\/td>\n <td>1 kN \u2248 0.102 tf<\/td>\n <td>1.02 tf<\/td>\n <\/tr>\n <tr>\n <td>US Ton-force<\/td>\n <td>short tonf<\/td>\n <td>1 kN \u2248 0.1124 tonf<\/td>\n <td>1.124 tonf<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/section>\n\n \n <section class=\"content-grid\">\n \n <div class=\"text-card\">\n <h3>Frequently Asked Questions<\/h3>\n <div class=\"faq-list\">\n <div class=\"faq-item\">\n <h4>Difference between kg and kgf?<\/h4>\n <p><strong>kg<\/strong> is mass; <strong>kgf<\/strong> is force. 1 kgf is the force gravity exerts on 1 kg mass. They are numerically similar but physically distinct.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>How to convert kN to kg?<\/h4>\n <p>Multiply kN by ~101.97 to get the equivalent mass in kg supported under standard gravity.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>What is a Kip?<\/h4>\n <p>“Kilo-pound” (1,000 lbf). Used in the US for structural loads to avoid large numbers.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>Is 1 kN = 100 kg?<\/h4>\n <p>Roughly. 1 kN \u2248 101.97 kgf. Engineers often use the “divide by 10” rule for quick estimates.<\/p>\n <\/div>\n <div class=\"faq-item\">\n <h4>Difference between Ton and Ton-force?<\/h4>\n <p><strong>Ton<\/strong> usually refers to mass (metric ton = 1000 kg), while <strong>Ton-force<\/strong> is the gravitational force exerted by that mass. Context is key in engineering specs.<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"display: flex; flex-direction: column; gap: 2rem;\">\n <div class=\"text-card\">\n <h3>\ud83d\ude80 Quick Reference<\/h3>\n <ul class=\"quick-list\">\n <li><span>1 kN<\/span> <strong>1000 N<\/strong><\/li>\n <li><span>1 kN<\/span> <strong>224.8 lbf<\/strong><\/li>\n <li><span>1 kip<\/span> <strong>4.448 kN<\/strong><\/li>\n <li><span>1 kgf<\/span> <strong>9.807 N<\/strong><\/li>\n <li><span>1 US tonf<\/span> <strong>2000 lbf<\/strong><\/li>\n <\/ul>\n <\/div>\n\n <div class=\"text-card\">\n <h3>\ud83d\udcc2 Popular Searches<\/h3>\n <p style=\"font-size: 0.9rem; margin-bottom: 0.75rem;\">Common conversions engineers look for:<\/p>\n <div class=\"tags\">\n <span class=\"tag\">kN to T<\/span>\n <span class=\"tag\">kg to N<\/span>\n <span class=\"tag\">kn to lbf<\/span>\n <span class=\"tag\">Tonnage to kN<\/span>\n <span class=\"tag\">ton-force to kN<\/span>\n <span class=\"tag\">Force Converter<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <\/div>\n\n <script>\n (function() {\n \/\/ Use a unique prefix or IIFE to avoid global scope pollution in WordPress\n \n \/**\n * Units Data\n * 1 kN = factor * Unit\n *\/\n const calculatorUnits = [\n \/\/ Metric\n { id: 'n', name: 'Newton', symbol: 'N', type: 'metric', ratioFromKN: 1000 },\n { id: 'kn', name: 'Kilonewton', symbol: 'kN', type: 'metric', ratioFromKN: 1 },\n { id: 'mn', name: 'Meganewton', symbol: 'MN', type: 'metric', ratioFromKN: 0.001 },\n { id: 'T', name: 'Metric ton-force', symbol: 'T', type: 'metric', ratioFromKN: 0.1019716 },\n { id: 'gf', name: 'Gram-force', symbol: 'gf', type: 'metric', ratioFromKN: 101971.62 },\n { id: 'kgf', name: 'Kilogram-force', symbol: 'kgf', type: 'metric', ratioFromKN: 101.9716 },\n \n \/\/ Imperial\n { id: 'lbf', name: 'Pound-force', symbol: 'lbf', type: 'imperial', ratioFromKN: 224.808943 },\n { id: 'kip', name: 'Kilopound-force', symbol: 'kip', type: 'imperial', ratioFromKN: 0.224808943 },\n { id: 'short_tonf', name: 'US ton-force', symbol: 'short tonf', type: 'imperial', ratioFromKN: 0.1124045 },\n { id: 'long_tonf', name: 'UK ton-force', symbol: 'long tonf', type: 'imperial', ratioFromKN: 0.100361 }\n ];\n\n \/\/ DOM Elements\n let mainInput, mainOutput, sourceSelect, targetSelect, swapBtn;\n let bannerSourceVal, bannerSourceUnit, bannerTargetVal, bannerTargetUnit;\n let metricCardsContainer, imperialCardsContainer;\n\n \/\/ State\n let state = {\n val: 1,\n sourceId: 'kn',\n targetId: 'n'\n };\n\n \/\/ Helper: Smart Format\n function smartFormat(num) {\n if (!isFinite(num)) return '';\n const abs = Math.abs(num);\n \n \/\/ Integer check\n if (Math.abs(num - Math.round(num)) < 1e-9) {\n \/\/ If it's huge, use scientific\n if (abs > 1e6) return num.toExponential(4).replace('+', '');\n return num.toFixed(0);\n }\n \n \/\/ Very small or very large -> scientific\n if (abs < 1e-3 || abs > 1e6) {\n return num.toExponential(4).replace('+', '');\n }\n \n \/\/ Standard decimal\n return parseFloat(num.toFixed(4)).toString();\n }\n\n \/\/ Init Logic\n function init() {\n \/\/ Get Elements safely\n const getEl = (id) => document.getElementById(id);\n \n mainInput = getEl('main-input');\n mainOutput = getEl('main-output');\n sourceSelect = getEl('source-unit');\n targetSelect = getEl('target-unit');\n swapBtn = getEl('swap-btn');\n \n bannerSourceVal = getEl('banner-source-val');\n bannerSourceUnit = getEl('banner-source-unit');\n bannerTargetVal = getEl('banner-target-val');\n bannerTargetUnit = getEl('banner-target-unit');\n \n metricCardsContainer = getEl('metric-cards');\n imperialCardsContainer = getEl('imperial-cards');\n\n if (!mainInput || !metricCardsContainer) {\n console.error('Calculator elements not found');\n return;\n }\n\n \/\/ Populate Selects\n calculatorUnits.forEach(u => {\n const opt1 = document.createElement('option');\n opt1.value = u.id;\n opt1.textContent = u.symbol;\n sourceSelect.appendChild(opt1);\n\n const opt2 = document.createElement('option');\n opt2.value = u.id;\n opt2.textContent = u.symbol;\n targetSelect.appendChild(opt2);\n });\n\n \/\/ Set Defaults\n sourceSelect.value = state.sourceId;\n targetSelect.value = state.targetId;\n\n \/\/ Render Empty Cards\n renderCards();\n\n \/\/ Calc Initial\n calculate();\n\n \/\/ Listeners\n mainInput.addEventListener('input', (e) => {\n const raw = parseFloat(e.target.value);\n state.val = isNaN(raw) ? NaN : raw;\n calculate('input');\n });\n\n mainOutput.addEventListener('input', (e) => {\n const raw = parseFloat(e.target.value);\n if (isNaN(raw)) {\n state.val = NaN;\n } else {\n \/\/ Reverse calc: Output -> Base (kN) -> Input\n const targetUnit = calculatorUnits.find(u => u.id === state.targetId);\n const sourceUnit = calculatorUnits.find(u => u.id === state.sourceId);\n const valInKN = raw \/ targetUnit.ratioFromKN;\n state.val = valInKN * sourceUnit.ratioFromKN;\n }\n calculate('output');\n });\n\n sourceSelect.addEventListener('change', (e) => {\n state.sourceId = e.target.value;\n calculate('input'); \/\/ Treat as input side change\n });\n\n targetSelect.addEventListener('change', (e) => {\n state.targetId = e.target.value;\n calculate('input'); \/\/ Preserve input val, recalc output\n });\n\n swapBtn.addEventListener('click', () => {\n \/\/ Swap IDs\n const tempId = state.sourceId;\n state.sourceId = state.targetId;\n state.targetId = tempId;\n \n \/\/ Update Selects\n sourceSelect.value = state.sourceId;\n targetSelect.value = state.targetId;\n \n \/\/ Recalculate (preserve numerical value of input field)\n calculate('input');\n });\n }\n\n function renderCards() {\n metricCardsContainer.innerHTML = '';\n imperialCardsContainer.innerHTML = '';\n\n calculatorUnits.forEach(u => {\n const card = document.createElement('div');\n card.className = 'unit-card';\n \n card.innerHTML = `\n <div class=\"card-label\">${u.name}<\/div>\n <div class=\"card-value-row\">\n <span class=\"card-value\" id=\"card-val-${u.id}\">-<\/span>\n <span class=\"card-unit\">${u.symbol}<\/span>\n <\/div>\n `;\n\n if (u.type === 'metric') {\n metricCardsContainer.appendChild(card);\n } else {\n imperialCardsContainer.appendChild(card);\n }\n });\n }\n\n function calculate(origin) {\n const sourceUnit = calculatorUnits.find(u => u.id === state.sourceId);\n const targetUnit = calculatorUnits.find(u => u.id === state.targetId);\n \n const inputVal = isNaN(state.val) ? 0 : state.val;\n \n \/\/ 1. Convert Input -> Base (kN)\n const valInKN = isNaN(state.val) ? 0 : state.val \/ sourceUnit.ratioFromKN;\n\n \/\/ 2. Convert Base -> Target\n const targetResult = valInKN * targetUnit.ratioFromKN;\n\n \/\/ Update DOM\n \/\/ Only update Input if change came from Output\n if (origin === 'output') {\n mainInput.value = isNaN(state.val) ? '' : smartFormat(state.val);\n }\n \n \/\/ Only update Output if change came from Input (or other controls)\n if (origin !== 'output') {\n mainOutput.value = isNaN(state.val) ? '' : smartFormat(targetResult);\n }\n\n \/\/ Update Banner\n if (isNaN(state.val)) {\n bannerSourceVal.textContent = '-';\n bannerTargetVal.textContent = '-';\n } else {\n \/\/ Ensure we show formatted values in banner\n const formattedSource = origin === 'output' ? smartFormat(state.val) : (origin === 'input' && mainInput.value ? mainInput.value : smartFormat(state.val));\n const formattedTarget = origin !== 'output' ? smartFormat(targetResult) : (mainOutput.value ? mainOutput.value : smartFormat(targetResult));\n \n bannerSourceVal.textContent = formattedSource;\n bannerSourceUnit.textContent = sourceUnit.symbol;\n bannerTargetVal.textContent = formattedTarget;\n bannerTargetUnit.textContent = targetUnit.symbol;\n }\n\n \/\/ Update All Cards\n calculatorUnits.forEach(u => {\n const el = document.getElementById(`card-val-${u.id}`);\n if (!el) return;\n \n if (isNaN(state.val)) {\n el.textContent = '-';\n } else {\n const res = valInKN * u.ratioFromKN;\n el.textContent = smartFormat(res);\n }\n });\n }\n\n \/\/ Run when DOM is ready\n if (document.readyState === 'loading') {\n document.addEventListener('DOMContentLoaded', init);\n } else {\n init();\n }\n })();\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Force Unit Converter | Convert N, kN, kgf, lbf, kip & More Precision engineering calculator for converting force units. Instantly<\/p>","protected":false},"author":1,"featured_media":74288,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-74216","page","type-page","status-publish","has-post-thumbnail","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/pages\/74216","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/comments?post=74216"}],"version-history":[{"count":0,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/pages\/74216\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/media\/74288"}],"wp:attachment":[{"href":"https:\/\/www.harsle.com\/pt\/wp-json\/wp\/v2\/media?parent=74216"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}