{"id":136,"date":"2025-09-20T01:54:14","date_gmt":"2025-09-20T01:54:14","guid":{"rendered":"https:\/\/tools.anyservspa.cl\/?page_id=136"},"modified":"2025-09-20T01:57:23","modified_gmt":"2025-09-20T01:57:23","slug":"conversor-de-viscosidad","status":"publish","type":"page","link":"https:\/\/tools.anyservspa.cl\/index.php\/conversor-de-viscosidad\/","title":{"rendered":"Conversor de Viscosidad"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"es\">\n<head>\n<meta charset=\"utf-8\">\n<title>Conversor de Viscosidad (cSt \u2194 cP) + ISO VG | Any-Serv SpA<\/title>\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n<style>\n:root{ --salmon:#DE643F; --panel:rgba(255,255,255,.08); --bd:rgba(255,255,255,.22); --txt:#E8F3FF; }\nbody{ margin:0; font-family:system-ui,Arial,sans-serif; color:var(--txt); background:transparent; }\n.wrap{ max-width:980px; margin:36px auto; padding:0 16px; }\nh1{ margin:0 0 8px; font-size:clamp(26px,4.5vw,40px); color:#fff; text-align:center; text-shadow:0 4px 14px rgba(0,0,0,.5); }\n.sub{ text-align:center; opacity:.9; margin:0 0 22px; }\n.card{ background:var(--panel); border:1px solid var(--bd); border-radius:16px; padding:22px;\n       backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); box-shadow:0 10px 30px rgba(0,0,0,.25); }\nh3{ margin:8px 0 14px; color:var(--salmon); font-size:22px; }\n.grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }\nlabel{ font-size:13px; opacity:.9; }\ninput, select{\n  width:100%; padding:12px; border-radius:10px; border:1px solid rgba(255,255,255,.2);\n  background:rgba(0,0,0,.25); color:#fff; font-size:16px; outline:none;\n}\n.badge{ display:inline-block; padding:6px 12px; border-radius:999px; font-weight:800; color:#fff; background:var(--salmon); }\n.res{ margin-top:14px; padding:14px; border-radius:12px; background:rgba(0,0,0,.35); }\n.note{ font-size:12px; opacity:.85; margin-top:10px; }\n.kpi{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin-top:10px; }\n.kpi div{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); border-radius:12px; padding:10px; }\n.kpi b{ font-size:18px; }\n@media (max-width:768px){\n  .wrap{ padding:12px !important; margin:16px auto !important; }\n  .card{ padding:16px !important; }\n  input, select{ font-size:16px !important; }\n}\n<\/style>\n<\/head>\n<body>\n<div class=\"wrap\">\n  <h1>Conversor de Viscosidad<\/h1>\n  <p class=\"sub\">Convierte <strong>cSt \u2194 cP<\/strong> con densidad, y usa el selector de <strong>ISO VG<\/strong> (a 40 \u00b0C) para rellenar valores.<\/p>\n\n  <div class=\"card\">\n    <h3>Valores<\/h3>\n    <div class=\"grid\">\n      <div>\n        <label>ISO VG (40 \u00b0C)<\/label>\n        <select id=\"iso\">\n          <option value=\"\">\u2014 Selecciona \u2014<\/option>\n        <\/select>\n      <\/div>\n      <div>\n        <label>Kinem\u00e1tica (cSt)<\/label>\n        <input id=\"cst\" type=\"number\" step=\"any\" placeholder=\"ej: 46\">\n      <\/div>\n      <div>\n        <label>Din\u00e1mica (cP)<\/label>\n        <input id=\"cp\" type=\"number\" step=\"any\" placeholder=\"ej: 41\">\n      <\/div>\n      <div>\n        <label>Densidad \u03c1 (g\/cm\u00b3)<\/label>\n        <input id=\"rho\" type=\"number\" step=\"any\" value=\"0.87\">\n      <\/div>\n    <\/div>\n\n    <div id=\"out\" class=\"res\" style=\"display:none\"><\/div>\n    <div class=\"note\">\n      F\u00f3rmulas: <strong>cP = cSt \u00d7 \u03c1<\/strong> y <strong>cSt = cP \u00f7 \u03c1<\/strong>.  \n      El grado <strong>ISO VG<\/strong> se define por la viscosidad cinem\u00e1tica a 40 \u00b0C (\u00b110% del valor nominal).\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n\/\/ Lista de ISO VG (valores nominales en cSt @40\u00b0C)\nconst isoVG = [2,3,5,7,10,15,22,32,46,68,100,150,220,320,460,680,1000];\n\n\/\/ DOM\nconst elISO = document.getElementById('iso');\nconst elCST = document.getElementById('cst');\nconst elCP  = document.getElementById('cp');\nconst elRHO = document.getElementById('rho');\nconst out   = document.getElementById('out');\n\n\/\/ Poblar selector ISO\nisoVG.forEach(v => {\n  const opt = document.createElement('option');\n  opt.value = v; opt.textContent = `VG ${v}`;\n  elISO.appendChild(opt);\n});\n\n\/\/ Bloqueo para evitar bucles\nlet lock = {iso:false, cst:false, cp:false, rho:false};\n\nfunction roundNice(n){\n  if(!Number.isFinite(n)) return '';\n  const a = Math.abs(n);\n  return (a >= 1 ? n.toFixed(2) : n.toFixed(4));\n}\n\nfunction nearestISO(v){\n  let best = isoVG[0], diff = Math.abs(v - isoVG[0]);\n  for(const g of isoVG){\n    const d = Math.abs(v - g);\n    if(d < diff){ diff = d; best = g; }\n  }\n  const within = Math.abs(v - best) <= best*0.1;\n  return {grade: best, within};\n}\n\nfunction render(cst, cp, rho){\n  const iso = nearestISO(cst);\n  \/\/ Seleccionar en el dropdown si coincide exactamente\n  if(!lock.iso){\n    lock.iso = true;\n    elISO.value = iso.grade; \/\/ siempre muestra el m\u00e1s cercano; es pr\u00e1ctico\n    lock.iso = false;\n  }\n  out.style.display = 'block';\n  out.innerHTML = `\n    <div class=\"kpi\">\n      <div><div>Viscosidad cinem\u00e1tica<\/div><b>${roundNice(cst)} cSt<\/b><\/div>\n      <div><div>Viscosidad din\u00e1mica<\/div><b>${roundNice(cp)} cP<\/b><\/div>\n      <div><div>Densidad<\/div><b>${roundNice(rho)} g\/cm\u00b3<\/b><\/div>\n      <div><div>ISO VG (40 \u00b0C)<\/div>\n        <b><span class=\"badge\">VG ${iso.grade}<\/span><\/b>\n        <div style=\"font-size:12px;opacity:.85;margin-top:4px;\">\n          ${iso.within ? 'Dentro del rango \u00b110%.' : 'Fuera del rango \u00b110% (valor aproximado).'}\n        <\/div>\n      <\/div>\n    <\/div>\n  `;\n}\n\n\/\/ --- Eventos ---\nelISO.addEventListener('change', () => {\n  if(lock.iso) return;\n  const v = parseFloat(elISO.value);\n  if(!isFinite(v)) return;\n  const rho = parseFloat(elRHO.value);\n  if(!isFinite(rho) || rho<=0) return;\n  \/\/ Rellenar cSt y cP desde ISO + densidad\n  lock.cst = true; elCST.value = roundNice(v); lock.cst = false;\n  const cp = v * rho;\n  lock.cp = true; elCP.value = roundNice(cp); lock.cp = false;\n  render(v, cp, rho);\n});\n\nelCST.addEventListener('input', () => {\n  if(lock.cst) return;\n  const cst = parseFloat(elCST.value), rho = parseFloat(elRHO.value);\n  if(!isFinite(cst) || !isFinite(rho) || rho<=0){ out.style.display='none'; out.innerHTML=''; return; }\n  const cp = cst * rho;\n  lock.cp = true; elCP.value = roundNice(cp); lock.cp = false;\n  render(cst, cp, rho);\n});\n\nelCP.addEventListener('input', () => {\n  if(lock.cp) return;\n  const cp = parseFloat(elCP.value), rho = parseFloat(elRHO.value);\n  if(!isFinite(cp) || !isFinite(rho) || rho<=0){ out.style.display='none'; out.innerHTML=''; return; }\n  const cst = cp \/ rho;\n  lock.cst = true; elCST.value = roundNice(cst); lock.cst = false;\n  render(cst, cp, rho);\n});\n\nelRHO.addEventListener('input', () => {\n  if(lock.rho) return;\n  \/\/ Recalcula desde cSt si hay, si no desde cP\n  const cst = parseFloat(elCST.value), cp = parseFloat(elCP.value), rho = parseFloat(elRHO.value);\n  if(isFinite(cst)){ lock.cst = true; elCST.value = roundNice(cst); lock.cst = false; const cp2=cst*rho; lock.cp=true; elCP.value=roundNice(cp2); lock.cp=false; render(cst, cp2, rho); }\n  else if(isFinite(cp)){ const cst2=cp\/rho; lock.cst=true; elCST.value=roundNice(cst2); lock.cst=false; render(cst2, cp, rho); }\n  else { out.style.display='none'; out.innerHTML=''; }\n});\n<\/script>\n<\/body>\n<\/html>\n\n\n\n\n<!-- Bot\u00f3n Volver (elegante con animaci\u00f3n) -->\r\n<div class=\"as-back-wrap\">\r\n  <button class=\"as-back-btn\" aria-label=\"Volver a la p\u00e1gina anterior\" title=\"Volver\">\r\n    <span class=\"as-icon\" aria-hidden=\"true\">\r\n      <!-- Flecha SVG -->\r\n      <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\">\r\n        <path d=\"M15 5l-7 7 7 7\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n      <\/svg>\r\n    <\/span>\r\n    <span class=\"as-text\">Volver<\/span>\r\n    <span class=\"as-glow\"><\/span>\r\n  <\/button>\r\n<\/div>\r\n\r\n<style>\r\n  .as-back-wrap{\r\n    position: fixed;\r\n    bottom: 22px; left: 22px; \/* c\u00e1mbialo a left si prefieres *\/\r\n    z-index: 9999;\r\n  }\r\n  .as-back-btn{\r\n    --bg: rgba(20,22,27,.75);\r\n    --bg2: rgba(20,22,27,.55);\r\n    --accent: #DE643F; \/* salm\u00f3n Any-Serv *\/\r\n    --txt: #f6f7fb;\r\n\r\n    display: inline-flex; align-items: center; gap: .6rem;\r\n    padding: .9rem 1.15rem;\r\n    color: var(--txt); background: linear-gradient(135deg,var(--bg),var(--bg2));\r\n    border: 1px solid rgba(255,255,255,.08);\r\n    border-radius: 14px;\r\n    backdrop-filter: blur(8px);\r\n    box-shadow: 0 10px 24px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.04);\r\n    cursor: pointer;\r\n    transition: transform .18s ease, box-shadow .25s ease;\r\n    position: relative; overflow: hidden;\r\n  }\r\n  .as-icon{ display: inline-grid; place-items:center; }\r\n  .as-text{ font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, \"Helvetica Neue\", Arial, sans-serif; font-weight: 600; letter-spacing:.2px; }\r\n\r\n  \/* Microinteracciones *\/\r\n  .as-back-btn:hover{ transform: translateY(-2px); box-shadow: 0 16px 32px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.06); }\r\n  .as-back-btn:active{ transform: translateY(0); }\r\n\r\n  \/* \u201cRespiraci\u00f3n\u201d sutil *\/\r\n  .as-back-btn::after{\r\n    content:\"\"; position:absolute; inset:-1px; border-radius:inherit;\r\n    background: radial-gradient(120px 120px at var(--mx,50%) var(--my,50%), rgba(222,100,63,.18), transparent 55%);\r\n    transition: background .15s ease;\r\n    pointer-events:none;\r\n  }\r\n\r\n  \/* Glow lateral *\/\r\n  .as-glow{\r\n    position:absolute; inset:-2px; border-radius:inherit;\r\n    background: conic-gradient(from 180deg at 50% 50%, transparent 0 20%, rgba(222,100,63,.18) 20% 30%, transparent 30% 100%);\r\n    filter: blur(10px); opacity:.0; transition: opacity .25s ease;\r\n    pointer-events:none;\r\n  }\r\n  .as-back-btn:hover .as-glow{ opacity:.8; }\r\n\r\n  \/* Animaci\u00f3n de la flecha *\/\r\n  .as-back-btn:hover .as-icon svg{ transform: translateX(-2px); }\r\n  .as-icon svg{ transition: transform .18s ease; }\r\n\r\n  \/* Modo reducido en m\u00f3viles *\/\r\n  @media (max-width:480px){\r\n    .as-text{ display:none; }\r\n    .as-back-btn{ padding:.8rem; border-radius:12px; }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\n  (function(){\r\n    const FALLBACK_URL = '\/'; \/\/ <-- Cambia aqu\u00ed si quieres otro destino por defecto\r\n    const btn = document.querySelector('.as-back-btn');\r\n\r\n    \/\/ Efecto \u201cfollow cursor\u201d para el brillo\r\n    btn.addEventListener('pointermove', (e)=>{\r\n      const r = e.currentTarget.getBoundingClientRect();\r\n      const x = e.clientX - r.left, y = e.clientY - r.top;\r\n      e.currentTarget.style.setProperty('--mx', x+'px');\r\n      e.currentTarget.style.setProperty('--my', y+'px');\r\n    });\r\n\r\n    btn.addEventListener('click', (e)=>{\r\n      e.preventDefault();\r\n      \/\/ Si hay historial \u201creal\u201d, volvemos. Si no, usamos fallback.\r\n      if (window.history.length > 1) {\r\n        window.history.back();\r\n      } else {\r\n        window.location.href = FALLBACK_URL;\r\n      }\r\n    });\r\n  })();\r\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Conversor de Viscosidad (cSt \u2194 cP) + ISO VG | Any-Serv SpA Conversor de Viscosidad Convierte cSt \u2194 cP con densidad, y usa el selector de ISO VG (a 40 \u00b0C) para rellenar valores. Valores ISO VG (40 \u00b0C) \u2014 Selecciona \u2014 Kinem\u00e1tica (cSt) Din\u00e1mica (cP) Densidad \u03c1 (g\/cm\u00b3) F\u00f3rmulas: cP = cSt \u00d7 \u03c1<\/p>\n<div class=\"more-link\">\n\t\t\t\t <a href=\"https:\/\/tools.anyservspa.cl\/index.php\/conversor-de-viscosidad\/\" class=\"link-btn theme-btn\"><span>Read More <\/span> <i class=\"fa fa-caret-right\"><\/i><\/a>\n\t\t\t<\/div>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-136","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/pages\/136","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/comments?post=136"}],"version-history":[{"count":3,"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/pages\/136\/revisions"}],"predecessor-version":[{"id":142,"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/pages\/136\/revisions\/142"}],"wp:attachment":[{"href":"https:\/\/tools.anyservspa.cl\/index.php\/wp-json\/wp\/v2\/media?parent=136"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}