{"id":7505,"date":"2026-07-25T13:37:17","date_gmt":"2026-07-25T13:37:17","guid":{"rendered":"https:\/\/h-in-q.com\/?page_id=7505"},"modified":"2026-07-26T13:57:08","modified_gmt":"2026-07-26T13:57:08","slug":"nps-calculator","status":"publish","type":"page","link":"https:\/\/h-in-q.com\/es\/nps-calculator\/","title":{"rendered":"NPS Calculator \u2014 Free Tool for Market Research | H-in-Q"},"content":{"rendered":"<div class=\"hin-back-nav\" style=\"font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; padding: 14px 24px 0;\"><a style=\"display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: #1976d2; text-decoration: none; background: #EFF6FE; border: 1px solid #BFDBFE; padding: 7px 14px; border-radius: 100px; transition: background .2s;\" href=\"https:\/\/h-in-q.com\/free-tools\/\">Back to Free Tools<\/a><\/div>\n<p> <!-- ==================================================== NPS CALCULATOR - H-in-Q Branded ==================================================== -->  <\/p>\n<style>@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap'); :root{ \/* --- H-in-Q design tokens --- *\/ --blue-900:#0E3A5F; --blue-700:#1B6FB4; --blue-600:#2381C9; --blue-500:#2BA9DE; --blue-200:#BFE4F7; --blue-100:#DCF0FA; --blue-50:#F1F8FD; --gray-700:#48525C; --gray-500:#7C8894; --gray-300:#C4CCD3; --gray-100:#EEF1F3; --orange-600:#E8752F; --orange-500:#F28C42; --orange-100:#FDE9DA; --white:#FFFFFF; --font-display:'Manrope', sans-serif; --font-body:'Inter', sans-serif; --radius-s:10px; --radius-m:16px; --radius-l:24px; --shadow-card:0 2px 6px rgba(14,58,95,0.06), 0 12px 32px rgba(14,58,95,0.06); } *{box-sizing:border-box;} html{scroll-behavior:smooth;} body{ margin:0; font-family:var(--font-body); color:var(--gray-700); background: radial-gradient(1200px 500px at 85% -10%, var(--blue-50) 0%, transparent 60%), linear-gradient(180deg, var(--white) 0%, #FBFDFE 100%); line-height:1.55; -webkit-font-smoothing:antialiased; } @media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;} } a{color:var(--blue-700);} :focus-visible{outline:2px solid var(--orange-500); outline-offset:2px; border-radius:4px;} .wrap{max-width:960px; margin:0 auto; padding:0 24px;} \/* ---------- Header ---------- *\/ header.top{ padding:28px 0 8px; } .brand{ display:flex; align-items:center; gap:10px; text-decoration:none; } .brand img{height:34px; width:34px; display:block;} .brand span{ font-family:var(--font-display); font-weight:800; font-size:18px; color:var(--blue-900); letter-spacing:-0.01em; } .eyebrow{ margin:36px 0 10px; display:flex; align-items:center; gap:10px; font-size:13px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--blue-600); } .eyebrow::before{ content:\"\"; width:24px; height:2px; background:var(--orange-500); display:inline-block; border-radius:2px; } h1{ font-family:var(--font-display); font-weight:800; letter-spacing:-0.02em; font-size:clamp(30px, 4.2vw, 44px); color:var(--blue-900); margin:0 0 14px; } .lede{ font-size:17px; color:var(--gray-700); max-width:640px; margin:0 0 8px; } .back-link{ display:inline-flex; align-items:center; gap:6px; font-size:13.5px; font-weight:600; color:var(--gray-500); text-decoration:none; margin-top:6px; } .back-link:hover{color:var(--blue-700);} \/* ---------- Section shell ---------- *\/ section{padding:44px 0;} section + section{border-top:1px solid var(--gray-100);} .section-head{margin-bottom:22px;} h2{ font-family:var(--font-display); font-weight:700; font-size:22px; color:var(--blue-900); letter-spacing:-0.01em; margin:0 0 6px; display:flex; align-items:center; gap:10px; } h2 .num{ font-family:var(--font-display); font-size:13px; font-weight:800; color:var(--blue-700); background:var(--blue-50); border:1px solid var(--blue-100); width:26px; height:26px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; flex:none; } .section-sub{color:var(--gray-500); font-size:15px; max-width:620px;} \/* ---------- Theory card ---------- *\/ .theory-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:20px; } @media (max-width:720px){ .theory-grid{grid-template-columns:1fr;} } .card{ background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius-m); padding:24px; box-shadow:var(--shadow-card); } .card p{margin:0 0 10px; font-size:14.5px;} .card p:last-child{margin-bottom:0;} .quote{ background:var(--blue-50); border-left:3px solid var(--blue-500); border-radius:0 var(--radius-s) var(--radius-s) 0; padding:16px 18px; font-family:var(--font-display); font-weight:600; font-size:15.5px; color:var(--blue-900); } .quote span{display:block; font-family:var(--font-body); font-weight:500; font-size:12.5px; color:var(--gray-500); margin-top:8px;} .source-note{font-size:12.5px; color:var(--gray-500); margin-top:12px;} \/* ---------- Scale ---------- *\/ .scale-track{ display:grid; grid-template-columns:repeat(11,1fr); border-radius:var(--radius-s); overflow:hidden; box-shadow:var(--shadow-card); margin-bottom:18px; } .scale-track .cell{ aspect-ratio:1\/1; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--white); } .cell.det{background:var(--gray-500);} .cell.pas{background:var(--blue-500);} .cell.pro{background:var(--blue-700);} .segment-legend{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; } @media (max-width:640px){ .segment-legend{grid-template-columns:1fr;} } .seg-card{ border-radius:var(--radius-m); padding:18px; border:1px solid var(--gray-100); } .seg-card .dot{width:10px; height:10px; border-radius:50%; display:inline-block; margin-right:8px;} .seg-card h3{ font-family:var(--font-display); font-size:15px; margin:0 0 6px; display:flex; align-items:center; color:var(--blue-900); } .seg-card .range{ font-family:var(--font-display); font-weight:800; font-size:12px; color:var(--gray-500); margin-bottom:8px; letter-spacing:0.02em; } .seg-card p{font-size:13.5px; margin:0; color:var(--gray-700);} .seg-card.det .dot{background:var(--gray-500);} .seg-card.pas .dot{background:var(--blue-500);} .seg-card.pro .dot{background:var(--blue-700);} \/* ---------- Formula ---------- *\/ .formula-box{ display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; background:var(--blue-900); border-radius:var(--radius-m); padding:30px 24px; color:var(--white); font-family:var(--font-display); font-weight:700; font-size:clamp(18px,3vw,26px); } .formula-box .op{color:var(--blue-200); font-weight:600;} .formula-box .tag{ font-size:11px; text-transform:uppercase; letter-spacing:0.06em; display:block; font-weight:600; color:var(--blue-200); margin-top:6px; } .formula-box .term{text-align:center;} .formula-box .promoters{color:var(--blue-200);} .formula-box .detractors{color:var(--orange-500);} .formula-note{text-align:center; font-size:13px; color:var(--gray-500); margin-top:14px;} \/* ---------- Calculator ---------- *\/ .calc-card{ background:var(--white); border:1px solid var(--gray-100); border-radius:var(--radius-l); box-shadow:var(--shadow-card); padding:32px; display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center; } @media (max-width:820px){ .calc-card{grid-template-columns:1fr; padding:24px;} } .field{margin-bottom:16px;} .field label{ display:flex; align-items:center; justify-content:space-between; font-family:var(--font-display); font-weight:700; font-size:13.5px; color:var(--blue-900); margin-bottom:8px; } .field label .dot{width:9px; height:9px; border-radius:50%; margin-right:8px; display:inline-block;} .field .input-row{ position:relative; display:flex; align-items:center; border:1.5px solid var(--gray-300); border-radius:var(--radius-s); background:var(--white); transition:border-color .15s; } .field .input-row:focus-within{border-color:var(--blue-500);} .field input[type=number]{ width:100%; border:none; background:transparent; outline:none; font-family:var(--font-display); font-weight:700; font-size:16px; color:var(--blue-900); padding:11px 12px; } .field .suffix{padding-right:14px; color:var(--gray-500); font-weight:600; font-size:14px;} .field input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;margin-top:14px;border-radius:999px;background:var(--gray-300);cursor:pointer;outline:none;}.field input[type=range]::-webkit-slider-runnable-track{-webkit-appearance:none;height:6px;background:transparent;border-radius:999px;}.field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--blue-600);box-shadow:0 1px 3px rgba(0,0,0,.25);margin-top:-6px;cursor:pointer;}.field input[type=range]::-moz-range-track{height:6px;background:var(--gray-300);border-radius:999px;}.field input[type=range]::-moz-range-progress{height:6px;background:var(--blue-600);border-radius:999px;}.field input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--blue-600);box-shadow:0 1px 3px rgba(0,0,0,.25);cursor:pointer;border:none;} .total-row{ display:flex; align-items:center; justify-content:space-between; font-size:13px; color:var(--gray-500); margin-top:4px; margin-bottom:22px; padding-top:10px; border-top:1px dashed var(--gray-300); } .total-row strong{color:var(--blue-900); font-family:var(--font-display);} .total-row.warn strong{color:var(--orange-600);} .total-hint{font-size:12px; color:var(--orange-600); margin-top:-14px; margin-bottom:18px; display:none;} .total-hint.show{display:block;} \/* Gauge *\/ .gauge-wrap{display:flex; flex-direction:column; align-items:center;} .gauge-wrap svg{width:100%; max-width:340px; height:auto; overflow:visible;} .needle{transform-origin:170px 165px; transition:transform .5s cubic-bezier(.34,1.56,.64,1);} .score-readout{text-align:center; margin-top:-6px;} .score-readout .num{ font-family:var(--font-display); font-weight:800; font-size:52px; color:var(--orange-600); letter-spacing:-0.02em; line-height:1; } .score-readout .label{ font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--blue-900); margin-top:4px; } .score-readout .band-desc{font-size:13px; color:var(--gray-500); max-width:280px; margin:6px auto 0;} .gauge-legend{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:14px; font-size:11.5px; color:var(--gray-500); } .gauge-legend span{display:flex; align-items:center; gap:5px;} .gauge-legend i{width:8px; height:8px; border-radius:2px; display:inline-block;} \/* ---------- Benchmark strip ---------- *\/ .bench-strip{ display:grid; grid-template-columns:repeat(5,1fr); border-radius:var(--radius-m); overflow:hidden; box-shadow:var(--shadow-card); } @media (max-width:720px){ .bench-strip{grid-template-columns:repeat(2,1fr);} } .bench-cell{ padding:16px 10px; text-align:center; color:var(--white); font-family:var(--font-display); } .bench-cell .range{font-size:12px; font-weight:600; opacity:0.85;} .bench-cell .lbl{font-size:13.5px; font-weight:800; margin-top:4px;} .bench-cell.b1{background:var(--gray-500);} .bench-cell.b2{background:var(--blue-300, #6FC1E8);} .bench-cell.b3{background:var(--blue-500);} .bench-cell.b4{background:var(--blue-700);} .bench-cell.b5{background:var(--blue-900);} \/* ---------- Footer ---------- *\/ footer{ padding:36px 0 60px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; } footer .fnote{font-size:12.5px; color:var(--gray-500); max-width:480px;} footer .cta{ font-family:var(--font-display); font-weight:700; font-size:13.5px; color:var(--white); background:var(--blue-700); padding:11px 20px; border-radius:999px; text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:background .15s; } footer .cta:hover{background:var(--blue-900);}<\/style>\n<div class=\"wrap\">\n<header class=\"top\"><a class=\"brand\" href=\"https:\/\/h-in-q.com\/\" target=\"_blank\" rel=\"noopener\"> <img decoding=\"async\" src=\"https:\/\/h-in-q.com\/wp-content\/uploads\/2024\/05\/cropped-H-in-Q-Logo-300x300-1.png\" alt=\"H-in-Q\" \/> H-in-Q <\/a><\/header>\n<div class=\"eyebrow\">Free tools \u00b7 Market research<\/div>\n<h1>Net Promoter Score (NPS) Calculator<\/h1>\n<p class=\"lede\">Measure customer loyalty and their likelihood to recommend you. A quick theory refresher, then your score calculated instantly from your three segments.<\/p>\n<p> <a class=\"back-link\" href=\"https:\/\/h-in-q.com\/free-tools\/\">\u2190 Back to free tools<\/a>  <\/div>\n<div class=\"wrap\">  <!-- 1. THEORY -->  <\/p>\n<section id=\"theorie\">\n<div class=\"section-head\">\n<h2><span class=\"num\">1<\/span>What is NPS?<\/h2>\n<p class=\"section-sub\">The fundamentals of the metric, in brief.<\/p>\n<\/p><\/div>\n<div class=\"theory-grid\">\n<div class=\"card\">The <strong>Net Promoter Score<\/strong> was developed by Fred Reichheld with Bain &#038; Company and Satmetrix, and introduced in 2003 in the Harvard Business Review. It is today the most widely used customer loyalty metric in the world. It&#8217;s based on a single question, called the \u201cultimate question\u201d: it predicts growth and loyalty better than a long, traditional satisfaction survey. Each respondent is then classified into one of three segments based on their score, making it possible to calculate an overall score that&#8217;s simple to track over time and compare across brands.<\/div>\n<div class=\"quote\">\u201cHow likely are you to recommend [brand \/ product \/ service] to a friend or colleague?\u201d The ultimate NPS question \u2014 rated from 0 to 10<\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- 2. SCALE -->  <\/p>\n<section id=\"echelle\">\n<div class=\"section-head\">\n<h2><span class=\"num\">2<\/span>The scale used<\/h2>\n<p class=\"section-sub\">Each respondent rates on an 11-point scale, then is classified into one of the three segments.<\/p>\n<\/p><\/div>\n<div class=\"scale-track\">\n<div class=\"cell det\">0<\/div>\n<div class=\"cell det\">1<\/div>\n<div class=\"cell det\">2<\/div>\n<div class=\"cell det\">3<\/div>\n<div class=\"cell det\">4<\/div>\n<div class=\"cell det\">5<\/div>\n<div class=\"cell det\">6<\/div>\n<div class=\"cell pas\">7<\/div>\n<div class=\"cell pas\">8<\/div>\n<div class=\"cell pro\">9<\/div>\n<div class=\"cell pro\">10<\/div>\n<\/p><\/div>\n<div class=\"segment-legend\">\n<div class=\"seg-card det\">\n<h3>Detractors<\/h3>\n<div class=\"range\">Scores 0 \u2013 6<\/div>\n<p> Dissatisfied customers, at risk of churning and likely to damage the brand&#8217;s reputation through negative word of mouth.  <\/p><\/div>\n<div class=\"seg-card pas\">\n<h3>Passives<\/h3>\n<div class=\"range\">Scores 7 \u2013 8<\/div>\n<p> Satisfied but unenthusiastic customers, vulnerable to competitor offers. They aren&#8217;t included in the score calculation.  <\/p><\/div>\n<div class=\"seg-card pro\">\n<h3>Promoters<\/h3>\n<div class=\"range\">Scores 9 \u2013 10<\/div>\n<p> Loyal, enthusiastic customers who actively recommend the brand and fuel its organic growth.  <\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- 3. FORMULA -->  <\/p>\n<section id=\"formule\">\n<div class=\"section-head\">\n<h2><span class=\"num\">3<\/span>The calculation<\/h2>\n<p class=\"section-sub\">NPS is expressed in points, on a scale from -100 to +100.<\/p>\n<\/p><\/div>\n<div class=\"formula-box\">\n<div class=\"term promoters\">% Promoters<span class=\"tag\">Scores 9\u201310<\/span><\/div>\n<div class=\"op\">\u2212<\/div>\n<div class=\"term detractors\">% Detractors<span class=\"tag\">Scores 0\u20136<\/span><\/div>\n<div class=\"op\">=<\/div>\n<div class=\"term\">NPS<\/div>\n<\/p><\/div>\n<p class=\"formula-note\">Passives are neither subtracted nor added: they count toward the total number of respondents, but not in the formula itself.<\/p>\n<\/section>\n<p><!-- 4. CALCULATOR -->  <\/p>\n<section id=\"calculateur\">\n<div class=\"section-head\">\n<h2><span class=\"num\">4<\/span>Calculate your NPS<\/h2>\n<p class=\"section-sub\">Enter the percentage of respondents in each segment. The total should reach 100%.<\/p>\n<\/p><\/div>\n<div class=\"calc-card\">\n<div class=\"inputs-col\">\n<div class=\"field\">  <label for=\"promoters\">Promoters (9\u201310)<span id=\"promotersVal\">45<\/span>%<\/label> <\/p>\n<div class=\"input-row\"><input id=\"promoters\" max=\"100\" min=\"0\" type=\"number\" value=\"45\" \/> <span class=\"suffix\">%<\/span><\/div>\n<p> <input id=\"promotersRange\" max=\"100\" min=\"0\" type=\"range\" value=\"45\" \/>  <\/div>\n<div class=\"field\">  <label for=\"passives\">Passives (7\u20138)<span id=\"passivesVal\">30<\/span>%<\/label> <\/p>\n<div class=\"input-row\"><input id=\"passives\" max=\"100\" min=\"0\" type=\"number\" value=\"30\" \/> <span class=\"suffix\">%<\/span><\/div>\n<p> <input id=\"passivesRange\" max=\"100\" min=\"0\" type=\"range\" value=\"30\" \/>  <\/div>\n<div class=\"field\">  <label for=\"detractors\">Detractors (0\u20136)<span id=\"detractorsVal\">25<\/span>%<\/label> <\/p>\n<div class=\"input-row\"><input id=\"detractors\" max=\"100\" min=\"0\" type=\"number\" value=\"25\" \/> <span class=\"suffix\">%<\/span><\/div>\n<p> <input id=\"detractorsRange\" max=\"100\" min=\"0\" type=\"range\" value=\"25\" \/>  <\/div>\n<div id=\"totalRow\" class=\"total-row\">Total of the three segments\u00a0: <strong id=\"totalVal\">100<\/strong>%<\/div>\n<div id=\"totalHint\" class=\"total-hint\">The total isn&#8217;t 100% \u2014 adjust your segments for an accurate result.<\/div>\n<\/p><\/div>\n<div class=\"gauge-wrap\">\n<div class=\"score-readout\">\n<div id=\"npsScore\" class=\"num\">20<\/div>\n<div id=\"npsBandLabel\" class=\"label\">Good<\/div>\n<div id=\"npsBandDesc\" class=\"band-desc\">A generally satisfied customer base, with clear room for improvement.<\/div>\n<\/p><\/div>\n<div class=\"gauge-legend\"><i style=\"background: var(--gray-500);\"><\/i>Critical <i style=\"background: #8FCBEA;\"><\/i>Fair <i style=\"background: var(--blue-500);\"><\/i>Good <i style=\"background: var(--blue-700);\"><\/i>Excellent <i style=\"background: var(--blue-900);\"><\/i>Exceptional<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<p><!-- 5. BENCHMARK -->  <\/p>\n<section id=\"benchmarks\">\n<div class=\"section-head\">\n<h2><span class=\"num\">5<\/span>Reading benchmarks<\/h2>\n<p class=\"section-sub\">Generally accepted rules of thumb, to be adjusted for your industry.<\/p>\n<\/p><\/div>\n<div class=\"bench-strip\">\n<div class=\"bench-cell b1\">\n<div class=\"range\">&lt; 0<\/div>\n<div class=\"lbl\">Critical<\/div>\n<\/p><\/div>\n<div class=\"bench-cell b2\">\n<div class=\"range\">0 \u2013 30<\/div>\n<div class=\"lbl\">Fair<\/div>\n<\/p><\/div>\n<div class=\"bench-cell b3\">\n<div class=\"range\">30 \u2013 50<\/div>\n<div class=\"lbl\">Good<\/div>\n<\/p><\/div>\n<div class=\"bench-cell b4\">\n<div class=\"range\">50 \u2013 70<\/div>\n<div class=\"lbl\">Excellent<\/div>\n<\/p><\/div>\n<div class=\"bench-cell b5\">\n<div class=\"range\">70 \u2013 100<\/div>\n<div class=\"lbl\">Exceptional<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/section>\n<footer>\n<p class=\"fnote\">This tool is provided for informational purposes by H-in-Q. For a reliable measurement, survey a sufficient sample of customers and track your NPS over time rather than as a one-off snapshot.<\/p>\n<p> <a class=\"cta\" href=\"https:\/\/h-in-q.com\/contact\/\">Talk to an expert \u2192<\/a>  <\/footer>\n<\/div>\n<p> <script>(function(){ const ids = ['promoters','passives','detractors']; const els = {}; ids.forEach(id=>{ els[id] = document.getElementById(id); els[id+'Range'] = document.getElementById(id+'Range'); els[id+'ValLbl'] = document.getElementById(id+'Val'); }); const totalVal = document.getElementById('totalVal'); const totalRow = document.getElementById('totalRow'); const totalHint = document.getElementById('totalHint'); const npsScore = document.getElementById('npsScore'); const npsBandLabel = document.getElementById('npsBandLabel'); const npsBandDesc = document.getElementById('npsBandDesc'); const svgNS='http:\/\/www.w3.org\/2000\/svg';const gaugeWrapEl=document.querySelector('.gauge-wrap');const gaugeSvg=document.createElementNS(svgNS,'svg');gaugeSvg.setAttribute('viewBox','0 0 340 180');gaugeSvg.setAttribute('width','100%');if(gaugeWrapEl){gaugeWrapEl.insertBefore(gaugeSvg, gaugeWrapEl.firstChild);}const needle=document.createElementNS(svgNS,'line');needle.id='needle';needle.setAttribute('class','needle');needle.setAttribute('x1','170');needle.setAttribute('y1','165');needle.setAttribute('x2','170');needle.setAttribute('y2','60');needle.setAttribute('stroke','#1B2A3D');needle.setAttribute('stroke-width','4');needle.setAttribute('stroke-linecap','round');const hub=document.createElementNS(svgNS,'circle');hub.setAttribute('cx','170');hub.setAttribute('cy','165');hub.setAttribute('r','7');hub.setAttribute('fill','#1B2A3D'); const bands = [ {min:-100, max:0, color:'#7C8894', label:'Critical', desc:\"Detractors outnumber promoters: a warning sign about the customer experience.\"}, {min:0, max:30, color:'#8FCBEA', label:'Fair', desc:'A generally satisfied customer base, with clear room for improvement.'}, {min:30, max:50, color:'#2BA9DE', label:'Good', desc:\"A solid level of recommendation, typical of well-established companies.\"}, {min:50, max:70, color:'#1B6FB4', label:'Excellent', desc:'Strong customer loyalty, driven by a majority of active promoters.'}, {min:70, max:100,color:'#0E3A5F', label:'Exceptional', desc:'A level reached by the most recommended brands in the world.'} ]; function bandFor(score){ return bands.find(b => score >= b.min && score <= b.max) || bands[bands.length-1]; } const cx = 170, cy = 165, r = 120; function polar(cx,cy,r,angleDeg){ const a = (angleDeg-180) * Math.PI\/180; return { x: cx + r*Math.cos(a), y: cy + r*Math.sin(a) }; } function arcPath(startAngle,endAngle){ const s = polar(cx,cy,r,startAngle); const e = polar(cx,cy,r,endAngle); const largeArc = (endAngle-startAngle) <= 180 ? 0 : 1; return `M ${s.x} ${s.y} A ${r} ${r} 0 ${largeArc} 1 ${e.x} ${e.y}`; } const bandsGroup=document.createElementNS(svgNS,'g');gaugeSvg.appendChild(bandsGroup);gaugeSvg.appendChild(needle);gaugeSvg.appendChild(hub); bands.forEach(b=>{ const startAngle = (b.min + 100) \/ 200 * 180; const endAngle = (b.max + 100) \/ 200 * 180; const path = document.createElementNS('http:\/\/www.w3.org\/2000\/svg','path'); path.setAttribute('d', arcPath(startAngle,endAngle)); path.setAttribute('fill','none'); path.setAttribute('stroke', b.color); path.setAttribute('stroke-width','22'); path.setAttribute('stroke-linecap', b.min===-100 ? 'round':'butt'); bandsGroup.appendChild(path); }); [[-100,'-100'],[0,'0'],[100,'+100']].forEach(([val,txt])=>{ const ang = (val+100)\/200*180; const p = polar(cx,cy,r+26,ang); const t = document.createElementNS('http:\/\/www.w3.org\/2000\/svg','text'); t.setAttribute('x',p.x); t.setAttribute('y',p.y+4); t.setAttribute('text-anchor','middle'); t.setAttribute('font-size','11'); t.setAttribute('font-weight','700'); t.setAttribute('fill','#7C8894'); t.setAttribute('font-family','Inter, sans-serif'); t.textContent = txt; bandsGroup.appendChild(t); }); function setNeedle(score){ const angle = (score+100)\/200*180 - 90; needle.style.transform = `rotate(${angle}deg)`; } function clamp(v,min,max){ return Math.max(min, Math.min(max, v)); } function sync(sourceId, value){ value = clamp(Math.round(value),0,100); els[sourceId].value = value; els[sourceId+'Range'].value = value; els[sourceId+'ValLbl'].textContent = value; els[sourceId+'Range'].style.background='linear-gradient(90deg,var(--blue-600) '+value+'%,var(--gray-300) '+value+'%)'; } function compute(){ const p = clamp(parseFloat(els.promoters.value)||0,0,100); const a = clamp(parseFloat(els.passives.value)||0,0,100); const d = clamp(parseFloat(els.detractors.value)||0,0,100); const total = p+a+d; totalVal.textContent = Math.round(total*10)\/10; const offTarget = Math.abs(total-100) > 0.5; totalRow.classList.toggle('warn', offTarget); totalHint.classList.toggle('show', offTarget); const score = Math.round(p - d); npsScore.textContent = (score>0?'+':'') + score; const band = bandFor(score); npsBandLabel.textContent = band.label; npsBandLabel.style.color = band.color; npsBandDesc.textContent = band.desc; npsScore.style.color = (score<0) ? '#B8501F' : 'var(--orange-600)'; setNeedle(clamp(score,-100,100)); } ids.forEach(id=>{ els[id].addEventListener('input', e=>{ sync(id, e.target.value); compute(); }); els[id+'Range'].addEventListener('input', e=>{ sync(id, e.target.value); compute(); }); }); ids.forEach(function(id){ sync(id, els[id].value); }); compute(); })();<\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Back to Free Tools H-in-Q Free tools \u00b7 Market research Net Promoter Score (NPS) Calculator Measure customer loyalty and their likelihood to recommend you. A quick theory refresher, then your score calculated instantly from your three segments. \u2190 Back to free tools 1What is NPS? The fundamentals of the metric, in brief. The Net Promoter&#8230;<\/p>","protected":false},"author":10,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7505","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/pages\/7505","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/comments?post=7505"}],"version-history":[{"count":8,"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/pages\/7505\/revisions"}],"predecessor-version":[{"id":7522,"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/pages\/7505\/revisions\/7522"}],"wp:attachment":[{"href":"https:\/\/h-in-q.com\/es\/wp-json\/wp\/v2\/media?parent=7505"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}