{"id":31,"date":"2026-09-27T08:17:00","date_gmt":"2026-09-27T08:17:00","guid":{"rendered":"https:\/\/bsolution.me\/it\/paint-calculator-4\/"},"modified":"2026-09-27T09:00:09","modified_gmt":"2026-09-27T09:00:09","slug":"paint-calculator-2","status":"publish","type":"page","link":"https:\/\/bsolution.me\/it\/paint-calculator-2\/","title":{"rendered":"\ud83c\udfa8 Calcolatore di pittura avanzato"},"content":{"rendered":"\n\n<style>\n\/* Perfected Futuristic Design System by Bsolution *\/\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Heebo:wght@300;400;500;700;800&display=swap');\n\n:root {\n    --f-bg: #F5F5F7;\n    --f-card: rgba(255, 255, 255, 0.85);\n    --f-text: #1d1d1f;\n    --f-muted: #86868b;\n    --f-accent: #0066cc;\n    --f-border: rgba(0, 0, 0, 0.08);\n    --f-shadow: 0 8px 30px rgba(0,0,0,0.04);\n}\n\n.dark-theme {\n    --f-bg: #000000;\n    --f-card: rgba(28, 28, 30, 0.85);\n    --f-text: #f5f5f7;\n    --f-muted: #86868b;\n    --f-accent: #2997ff;\n    --f-border: rgba(255, 255, 255, 0.12);\n    --f-shadow: 0 8px 40px rgba(0,0,0,0.6);\n}\n\n.futur-layout {\n    max-width: 900px;\n    margin: 0 auto;\n    padding: 60px 20px;\n    font-family: 'Heebo', -apple-system, system-ui, sans-serif;\n    direction: ltr;\n    color: var(--f-text);\n    background-color: transparent;\n    transition: color 0.3s ease;\n}\n\n\/* Global Background override when tool is active *\/\nbody.tool-active {\n    background-color: var(--f-bg) !important;\n}\n\n.futur-glass-card {\n    background: var(--f-card);\n    backdrop-filter: saturate(180%) blur(20px);\n    -webkit-backdrop-filter: saturate(180%) blur(20px);\n    border: 1px solid var(--f-border);\n    border-radius: 22px;\n    padding: 40px;\n    box-shadow: var(--f-shadow);\n    margin-bottom: 40px;\n}\n\n.futur-layout h1.wp-block-heading {\n    font-size: clamp(2.5rem, 5vw, 3.5rem);\n    font-weight: 800;\n    color: var(--f-text);\n    margin-bottom: 12px;\n    letter-spacing: -0.02em;\n    text-align: center;\n}\n\n.futur-layout .tool-card {\n    width: 80%;\n    margin: 0 auto 40px auto;\n}\n@media (max-width: 900px) {\n    .futur-layout .tool-card { width: 100%; }\n}\n\n.futur-layout header {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n    gap: 12px;\n    margin-bottom: 34px;\n    max-width: 800px;\n    margin-left: auto;\n    margin-right: auto;\n}\n.futur-layout header h1, \n.futur-layout header h2.main-title,\n.futur-layout header .title-wrap .main-title {\n    margin: 0;\n    font-size: clamp(2rem, 4vw, 2.7rem);\n    font-weight: 800;\n    letter-spacing: -0.02em;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 10px;\n    color: var(--f-text);\n}\n.futur-layout header h2.main-title span.icon { font-size: 1.25em; }\n.futur-layout header .subtitle,\n.futur-layout header p.subtitle {\n    margin: 0;\n    font-size: 1.05rem;\n    color: var(--f-muted);\n    line-height: 1.6;\n}\n.futur-layout header .badge-local,\n.futur-layout header .free-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 0.78rem;\n    padding: 6px 14px;\n    border-radius: 999px;\n    border: 1px solid var(--f-border);\n    background: var(--f-card);\n    color: var(--f-text);\n    box-shadow: 0 4px 10px rgba(0,0,0,0.02);\n}\n.futur-layout header .badge-dot,\n.futur-layout header .free-dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 999px;\n    background: #22c55e;\n    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.25);\n}\n\n.futur-layout .page-hook {\n    font-size: 1.25rem;\n    color: var(--f-muted);\n    text-align: center;\n    margin-bottom: 50px;\n    max-width: 700px;\n    margin-left: auto;\n    margin-right: auto;\n}\n\n.futur-layout h2.wp-block-heading {\n    font-size: 1.7rem;\n    font-weight: 700;\n    margin: 40px 0 20px;\n}\n\n.futur-layout p {\n    font-size: 1.15rem;\n    color: var(--f-text);\n    opacity: 0.9;\n    margin-bottom: 24px;\n    line-height: 1.7;\n}\n\n\/* Theme Toggle Button *\/\n.theme-toggle-wrap {\n    display: flex;\n    justify-content: flex-end;\n    margin-bottom: 20px;\n}\n.theme-btn {\n    background: var(--f-card);\n    border: 1px solid var(--f-border);\n    color: var(--f-text);\n    padding: 8px 16px;\n    border-radius: 999px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    box-shadow: var(--f-shadow);\n}\n\n\/* Input & Button Styles for Tools *\/\n.futur-input {\n    width: 100%;\n    padding: 12px 16px;\n    border-radius: 12px;\n    border: 1px solid var(--f-border);\n    background: rgba(0,0,0,0.03);\n    color: var(--f-text);\n    font-size: 1rem;\n    margin-bottom: 16px;\n    transition: all 0.2s ease;\n}\n.dark-theme .futur-input { background: rgba(255,255,255,0.05); }\n\n.futur-btn {\n    background: var(--f-accent);\n    color: #fff;\n    border: none;\n    padding: 14px 28px;\n    border-radius: 12px;\n    font-weight: 700;\n    font-size: 1.1rem;\n    cursor: pointer;\n    transition: transform 0.2s ease;\n}\n.futur-btn:hover { transform: scale(1.02); }\n\n@media (max-width: 600px) {\n    .futur-layout { padding: 40px 16px; }\n    .futur-glass-card { padding: 24px; }\n}\n<\/style>\n<script>\n(function() {\n    var applyTheme = function(theme) {\n        if (theme === 'dark') {\n            document.documentElement.classList.add('dark-theme');\n        } else {\n            document.documentElement.classList.remove('dark-theme');\n        }\n        localStorage.setItem('bsolution-theme', theme);\n    };\n    \n    \/\/ Apply saved theme immediately\n    document.body.classList.add('tool-active');\n    var saved = localStorage.getItem('bsolution-theme') || 'light';\n    applyTheme(saved);\n    \n    \/\/ Bind theme toggle button (with retry since it may not exist yet)\n    function bindToggle() {\n        var btn = document.getElementById('globalThemeToggle');\n        if (!btn) { setTimeout(bindToggle, 100); return; }\n        if (btn.dataset.bound) return;\n        btn.dataset.bound = '1';\n        btn.addEventListener('click', function() {\n            var isDark = document.documentElement.classList.contains('dark-theme');\n            applyTheme(isDark ? 'light' : 'dark');\n        });\n    }\n    bindToggle();\n})();\n<\/script>\n\n<div class=\"futur-layout\">\n<div class=\"theme-toggle-wrap\"><button class=\"theme-btn\" id=\"globalThemeToggle\">\ud83c\udf19 Modalit\u00e0 Scura<\/button><\/div>\n\n\n\n<header>\n<h2 class=\"main-title\">Calcolatore di pittura avanzato <span class=\"icon pill\">\ud83c\udfa8<\/span><\/h2>\n<p class=\"subtitle\">Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.<\/p>\n<div class=\"free-badge\"><span class=\"free-dot\"><\/span> Completamente gratuito<\/div>\n<\/header>\n\n\n\n<div class=\"futur-glass-card tool-card\">\n<div id=\"bnet-tool-paint-calculator\">\n<style>\n    \/* CSS Variables: Light Mode *\/\n    #bnet-tool-paint-calculator {\n      --bg-color: transparent;\n      --text-color: #333333;\n      --border-color: #e5e5e5;\n      --accent-color: #0066cc;\n      --secondary-bg: #f8f9fa;\n      --danger-color: #dc3545;\n      --radius: 12px;\n      font-family: 'Heebo', sans-serif;\n      direction: ltr;\n      color: var(--text-color);\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n    \n    \/* CSS Variables: Dark Mode *\/\n    .dark-theme #bnet-tool-paint-calculator {\n      --text-color: #f5f5f5;\n      --border-color: #444444;\n      --accent-color: #2997ff;\n      --secondary-bg: #1a1a1a;\n    }\n\n    #bnet-tool-paint-calculator * {\n      box-sizing: border-box;\n    }\n\n    \/* Styles scoped only to this tool *\/\n    #bnet-tool-paint-calculator .calculator-container {\n      display: flex;\n      flex-direction: column;\n      gap: 20px;\n    }\n\n    #bnet-tool-paint-calculator .section-title {\n      font-size: 1.1rem;\n      font-weight: bold;\n      margin-bottom: 10px;\n      color: var(--text-color);\n    }\n    \n    #bnet-tool-paint-calculator .section-subtitle {\n      font-size: 0.9rem;\n      color: #666;\n      margin-bottom: 15px;\n    }\n\n    .dark-theme #bnet-tool-paint-calculator .section-subtitle {\n      color: #aaa;\n    }\n\n    #bnet-tool-paint-calculator .input-group {\n      display: flex;\n      flex-direction: column;\n      gap: 6px;\n      margin-bottom: 15px;\n    }\n\n    #bnet-tool-paint-calculator label {\n      font-size: 0.9rem;\n      font-weight: 600;\n    }\n\n    #bnet-tool-paint-calculator select, \n    #bnet-tool-paint-calculator input[type=\"number\"],\n    #bnet-tool-paint-calculator input[type=\"text\"] {\n      width: 100%;\n      padding: 10px 14px;\n      border: 1px solid var(--border-color);\n      border-radius: 8px;\n      background: var(--secondary-bg);\n      color: var(--text-color);\n      font-family: inherit;\n      font-size: 1rem;\n    }\n    \n    #bnet-tool-paint-calculator select:focus, \n    #bnet-tool-paint-calculator input:focus {\n      outline: none;\n      border-color: var(--accent-color);\n      box-shadow: 0 0 0 2px rgba(0, 102, 204, 0.2);\n    }\n    \n    .dark-theme #bnet-tool-paint-calculator select:focus, \n    .dark-theme #bnet-tool-paint-calculator input:focus {\n      box-shadow: 0 0 0 2px rgba(41, 151, 255, 0.2);\n    }\n\n    #bnet-tool-paint-calculator details {\n      background: var(--secondary-bg);\n      border: 1px solid var(--border-color);\n      border-radius: var(--radius);\n      padding: 15px;\n      margin-bottom: 20px;\n    }\n    \n    #bnet-tool-paint-calculator summary {\n      font-weight: bold;\n      cursor: pointer;\n      user-select: none;\n      outline: none;\n    }\n\n    #bnet-tool-paint-calculator .chips {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 8px;\n    }\n\n    #bnet-tool-paint-calculator .chip {\n      background: var(--secondary-bg);\n      border: 1px solid var(--border-color);\n      color: var(--text-color);\n      padding: 8px 12px;\n      border-radius: 20px;\n      cursor: pointer;\n      font-size: 0.9rem;\n      transition: all 0.2s ease;\n    }\n\n    #bnet-tool-paint-calculator .chip.active {\n      background: var(--accent-color);\n      color: #fff;\n      border-color: var(--accent-color);\n    }\n\n    #bnet-tool-paint-calculator .areas-list {\n      display: flex;\n      flex-direction: column;\n      gap: 10px;\n    }\n\n    #bnet-tool-paint-calculator .area-row {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 10px;\n      align-items: center;\n      background: var(--bg-color);\n      padding: 10px;\n      border-radius: var(--radius);\n      border: 1px solid var(--border-color);\n    }\n\n    #bnet-tool-paint-calculator .area-row > div {\n      flex: 1;\n      min-width: 120px;\n    }\n\n    #bnet-tool-paint-calculator .btn {\n      padding: 10px 16px;\n      border: none;\n      border-radius: 8px;\n      font-weight: bold;\n      cursor: pointer;\n      font-family: inherit;\n      transition: background 0.2s ease;\n    }\n\n    #bnet-tool-paint-calculator .btn-primary {\n      background: var(--accent-color);\n      color: #fff;\n      width: 100%;\n      font-size: 1.1rem;\n      padding: 14px;\n      margin-top: 10px;\n    }\n\n    #bnet-tool-paint-calculator .btn-danger {\n      background: rgba(220, 53, 69, 0.1);\n      color: var(--danger-color);\n      border: 1px solid rgba(220, 53, 69, 0.3);\n      padding: 8px 12px;\n    }\n\n    #bnet-tool-paint-calculator .btn-secondary {\n      background: var(--secondary-bg);\n      color: var(--text-color);\n      border: 1px solid var(--border-color);\n    }\n    \n    #bnet-tool-paint-calculator .btn-secondary:hover {\n      background: rgba(0, 0, 0, 0.05);\n    }\n    \n    .dark-theme #bnet-tool-paint-calculator .btn-secondary:hover {\n      background: rgba(255, 255, 255, 0.05);\n    }\n\n    #bnet-tool-paint-calculator .result-panel {\n      background: rgba(0, 102, 204, 0.05);\n      border: 1px dashed var(--accent-color);\n      border-radius: var(--radius);\n      padding: 20px;\n      text-align: center;\n      margin-top: 20px;\n    }\n\n    .dark-theme #bnet-tool-paint-calculator .result-panel {\n      background: rgba(41, 151, 255, 0.1);\n    }\n\n    #bnet-tool-paint-calculator .result-value {\n      font-size: 2.5rem;\n      font-weight: 900;\n      color: var(--accent-color);\n      margin: 10px 0;\n    }\n\n    #bnet-tool-paint-calculator .result-unit {\n      font-size: 1.2rem;\n      font-weight: normal;\n    }\n\n    #bnet-tool-paint-calculator .result-details {\n      font-size: 0.9rem;\n      color: var(--text-color);\n      background: var(--secondary-bg);\n      padding: 10px;\n      border-radius: 8px;\n      margin-top: 15px;\n      text-align: left;\n      line-height: 1.6;\n    }\n\n    #bnet-tool-paint-calculator .error-msg {\n      color: var(--danger-color);\n      font-size: 0.85rem;\n      margin-top: 5px;\n      display: none;\n    }\n    \n    #bnet-tool-paint-calculator .buttons-row {\n      display: flex;\n      gap: 10px;\n      margin-bottom: 15px;\n    }\n    \n    @media (max-width: 600px) {\n      #bnet-tool-paint-calculator .area-row {\n        flex-direction: column;\n        align-items: stretch;\n      }\n      #bnet-tool-paint-calculator .area-row > div {\n        width: 100%;\n      }\n    }\n  <\/style>\n<div class=\"calculator-container\">\n<div>\n<div class=\"section-title\">\ud83e\uddee Impostazioni di base<\/div>\n<p class=\"section-subtitle\">Le impostazioni qui si applicano a tutte le aree inserite di seguito. Se ci sono superfici di natura diversa, si consiglia di calcolare separatamente.<\/p>\n<div class=\"input-group\">\n<label for=\"paint-surface\">Tipo di superficie<\/label>\n<select id=\"paint-surface\">\n<option selected=\"\" value=\"wall_interior\">Parete interna \/ Soffitto (intonaco\/calcestruzzo)<\/option>\n<option value=\"wall_exterior\">Parete esterna ruvida<\/option>\n<option value=\"deck_wood\">Deck \/ Superficie in legno per esterni<\/option>\n<option value=\"furniture_wood\">Armadio \/ Mobile in legno<\/option>\n<option value=\"metal\">Superficie metallica<\/option>\n<option value=\"floor_epoxy\">Pavimento (Vernice per pavimenti \/ Epossidica)<\/option>\n<\/select>\n<\/div>\n<div class=\"input-group\">\n<label for=\"paint-type\">Tipo di vernice<\/label>\n<select id=\"paint-type\">\n<option selected=\"\" value=\"water_wall\">Idropittura \/ Acrilico per pareti<\/option>\n<option value=\"oil_wall\">Smalto \/ Vernice a base di olio<\/option>\n<option value=\"wood_water\">Vernice \/ Smalto all&#8217;acqua per legno<\/option>\n<option value=\"wood_oil\">Vernice \/ Smalto a base di olio per legno<\/option>\n<option value=\"metal_enamel\">Smalto \/ Vernice per metallo<\/option>\n<option value=\"epoxy\">Epossidica bicomponente<\/option>\n<option value=\"spray_can\">Spray (bomboletta)<\/option>\n<\/select>\n<\/div>\n<div class=\"input-group\">\n<label for=\"paint-coats\">Numero di mani previste<\/label>\n<input id=\"paint-coats\" inputmode=\"numeric\" min=\"1\" step=\"1\" type=\"number\" value=\"2\"\/>\n<div class=\"error-msg\" id=\"coats-err\">Inserire un numero valido di mani (1 o pi\u00f9).<\/div>\n<\/div>\n<\/div>\n<details>\n<summary>\u2699\ufe0f Impostazioni avanzate<\/summary>\n<div style=\"margin-top: 15px;\">\n<div class=\"input-group\">\n<label for=\"paint-safety\">Margine di sicurezza (%)<\/label>\n<input id=\"paint-safety\" inputmode=\"numeric\" min=\"0\" step=\"1\" type=\"number\" value=\"12\"\/>\n<p style=\"margin: 5px 0 0; font-size: 0.8rem; color: #666;\">Si consiglia di mantenere un margine per i ritocchi (10%-15%).<\/p>\n<\/div>\n<div class=\"input-group\">\n<label>Assorbenza \/ Struttura della superficie<\/label>\n<div class=\"chips\" id=\"texture-chips\">\n<button class=\"chip active\" data-val=\"smooth\" type=\"button\">Liscia \/ Non assorbente<\/button>\n<button class=\"chip\" data-val=\"normal\" type=\"button\">Normale<\/button>\n<button class=\"chip\" data-val=\"rough\" type=\"button\">Ruvida \/ Assorbente<\/button>\n<\/div>\n<\/div>\n<div class=\"input-group\">\n<label>Metodo di pittura<\/label>\n<div class=\"chips\" id=\"method-chips\">\n<button class=\"chip active\" data-val=\"roller\" type=\"button\">Rullo<\/button>\n<button class=\"chip\" data-val=\"brush\" type=\"button\">Pennello<\/button>\n<button class=\"chip\" data-val=\"spray_gun\" type=\"button\">Spruzzo (Pistola)<\/button>\n<button class=\"chip\" data-val=\"spray_can\" type=\"button\">Bomboletta spray<\/button>\n<\/div>\n<\/div>\n<\/div>\n<\/details>\n<div>\n<div class=\"section-title\">\ud83d\udcd0 Aree da calcolare<\/div>\n<p class=\"section-subtitle\">Inserisci tutte le aree da dipingere in mq. \u00c8 possibile aggiungere pareti e stanze diverse.<\/p>\n<div class=\"buttons-row\">\n<button class=\"btn btn-secondary\" id=\"add-area-btn\" type=\"button\">\u2795 Aggiungi area<\/button>\n<button class=\"btn btn-secondary\" id=\"clear-areas-btn\" type=\"button\">\ud83d\uddd1\ufe0f Cancella tutto<\/button>\n<\/div>\n<div class=\"areas-list\" id=\"areas-list\">\n<\/div>\n<div class=\"error-msg\" id=\"areas-err\">Inserisci almeno un&#8217;area valida (maggiore di 0 mq).<\/div>\n<\/div>\n<button class=\"btn btn-primary\" id=\"calc-btn\" type=\"button\">Calcola quantit\u00e0 di vernice<\/button>\n<div class=\"result-panel\" id=\"result-panel\" style=\"display: none;\">\n<div class=\"section-title\">La quantit\u00e0 consigliata per te \u00e8:<\/div>\n<div class=\"result-value\">\n<span id=\"result-liters\">0.00<\/span>\n<span class=\"result-unit\">Litri<\/span>\n<\/div>\n<p id=\"result-subtitle\" style=\"margin: 0;\">Margine di sicurezza incluso.<\/p>\n<div class=\"result-details\" id=\"result-details\">\n<\/div>\n<\/div>\n<\/div>\n<script>\n    document.addEventListener(\"DOMContentLoaded\", () => {\n      const container = document.getElementById(\"bnet-tool-paint-calculator\");\n      if (!container) return;\n      \n      \/\/ Elements\n      const surfaceEl = container.querySelector(\"#paint-surface\");\n      const paintEl = container.querySelector(\"#paint-type\");\n      const coatsEl = container.querySelector(\"#paint-coats\");\n      const safetyEl = container.querySelector(\"#paint-safety\");\n      const textureChipsBox = container.querySelector(\"#texture-chips\");\n      const methodChipsBox = container.querySelector(\"#method-chips\");\n      const areasList = container.querySelector(\"#areas-list\");\n      const addAreaBtn = container.querySelector(\"#add-area-btn\");\n      const clearAreasBtn = container.querySelector(\"#clear-areas-btn\");\n      const calcBtn = container.querySelector(\"#calc-btn\");\n      const resultPanel = container.querySelector(\"#result-panel\");\n      \n      let currentTexture = \"smooth\";\n      let currentMethod = \"roller\";\n\n      \/\/ Constants\n      const baseCoverage = {\n        water_wall: 11,\n        oil_wall: 13,\n        wood_water: 10,\n        wood_oil: 9,\n        metal_enamel: 11,\n        epoxy: 8,\n        spray_can: 2\n      };\n      \n      const surfaceFactor = {\n        wall_interior: 1.00,\n        wall_exterior: 0.80,\n        deck_wood: 0.75,\n        furniture_wood: 0.95,\n        metal: 1.00,\n        floor_epoxy: 0.85\n      };\n      \n      const textureFactor = { smooth: 1.00, normal: 0.90, rough: 0.75 };\n      const methodFactor = { roller: 1.00, brush: 0.90, spray_gun: 0.80, spray_can: 0.70 };\n\n      \/\/ Helper for chips\n      function bindChips(box, onChange) {\n        box.addEventListener(\"click\", (e) => {\n          const btn = e.target.closest(\".chip\");\n          if (!btn) return;\n          box.querySelectorAll(\".chip\").forEach(b => b.classList.remove(\"active\"));\n          btn.classList.add(\"active\");\n          onChange(btn.getAttribute(\"data-val\"));\n        });\n      }\n\n      bindChips(textureChipsBox, val => currentTexture = val);\n      bindChips(methodChipsBox, val => currentMethod = val);\n\n      \/\/ Areas Management\n      function createAreaRow(name = \"\", area = \"\") {\n        const row = document.createElement(\"div\");\n        row.className = \"area-row\";\n        row.innerHTML = \\`\n          <div class=\"input-group\" style=\"margin: 0;\">\n            <label>Nome dell'area (opzionale)<\/label>\n            <input type=\"text\" class=\"area-name\" placeholder=\"Ad esempio: Soggiorno\" value=\"\\${name}\">\n          <\/div>\n          <div class=\"input-group\" style=\"margin: 0;\">\n            <label>Area (mq)<\/label>\n            <input type=\"number\" class=\"area-val\" min=\"0\" step=\"0.1\" placeholder=\"Ad esempio: 15.5\" value=\"\\${area}\">\n          <\/div>\n          <div style=\"flex: 0 0 auto; display: flex; align-items: flex-end; padding-bottom: 2px;\">\n            <button class=\"btn btn-danger del-area-btn\" type=\"button\" aria-label=\"Elimina area\">\u2715 Elimina<\/button>\n          <\/div>\n        \\`;\n        \n        row.querySelector(\".del-area-btn\").addEventListener(\"click\", () => {\n          row.remove();\n          if (areasList.children.length === 0) {\n            addAreaRow();\n          }\n        });\n        \n        return row;\n      }\n\n      function addAreaRow() {\n        areasList.appendChild(createAreaRow());\n      }\n\n      addAreaBtn.addEventListener(\"click\", addAreaRow);\n      \n      clearAreasBtn.addEventListener(\"click\", () => {\n        areasList.innerHTML = \"\";\n        addAreaRow();\n        resultPanel.style.display = \"none\";\n      });\n\n      \/\/ Initialize with one empty row\n      addAreaRow();\n\n      \/\/ Calculation logic\n      function calc() {\n        \/\/ Validation\n        let isValid = true;\n        \n        const coats = parseFloat(coatsEl.value);\n        if (isNaN(coats) || coats < 1) {\n          container.querySelector(\"#coats-err\").style.display = \"block\";\n          isValid = false;\n        } else {\n          container.querySelector(\"#coats-err\").style.display = \"none\";\n        }\n\n        let totalArea = 0;\n        let validAreas = 0;\n        \n        areasList.querySelectorAll(\".area-row\").forEach(row => {\n          const val = parseFloat(row.querySelector(\".area-val\").value);\n          if (!isNaN(val) && val > 0) {\n            totalArea += val;\n            validAreas++;\n          }\n        });\n\n        if (validAreas === 0) {\n          container.querySelector(\"#areas-err\").style.display = \"block\";\n          isValid = false;\n        } else {\n          container.querySelector(\"#areas-err\").style.display = \"none\";\n        }\n\n        if (!isValid) return;\n\n        \/\/ Math\n        const safety = parseFloat(safetyEl.value) || 0;\n        const paint = paintEl.value;\n        const surface = surfaceEl.value;\n        \n        const cov = baseCoverage[paint] || 10;\n        const sf = surfaceFactor[surface] || 1;\n        const tf = textureFactor[currentTexture] || 1;\n        const mf = methodFactor[currentMethod] || 1;\n        \n        const effCoverage = cov * sf * tf * mf;\n        const litersRaw = (totalArea * coats) \/ effCoverage;\n        const litersWithSafety = litersRaw * (1 + (safety \/ 100));\n        \n        const litersRounded = Math.ceil(litersWithSafety * 100) \/ 100;\n\n        \/\/ Display\n        container.querySelector(\"#result-liters\").textContent = litersRounded.toFixed(2);\n        \n        const surfaceText = surfaceEl.options[surfaceEl.selectedIndex].text;\n        const paintText = paintEl.options[paintEl.selectedIndex].text;\n        \n        container.querySelector(\"#result-details\").innerHTML = \\`\n          <strong>Dettagli del calcolo:<\/strong><br>\n          Superficie totale: <strong>\\${totalArea.toFixed(1)} mq<\/strong><br>\n          Numero di mani: <strong>\\${coats}<\/strong><br>\n          Tipo di superficie: <strong>\\${surfaceText}<\/strong><br>\n          Tipo di vernice: <strong>\\${paintText}<\/strong><br>\n          Resa teorica stimata: <strong>\\${cov.toFixed(1)} mq\/litro<\/strong><br>\n          Resa effettiva (dopo i coefficienti): <strong>\\${effCoverage.toFixed(1)} mq\/litro<\/strong><br>\n          Margine di sicurezza aggiunto: <strong>\\${safety}%<\/strong>\n        \\`;\n        \n        resultPanel.style.display = \"block\";\n        \n        \/\/ Scroll to result smoothly\n        resultPanel.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n      }\n\n      calcBtn.addEventListener(\"click\", calc);\n    });\n  <\/script>\n<\/div>\n<\/div>\n\n\n\n<div class=\"futur-glass-card seo-card\">\n\n\n\n<h2 class=\"wp-block-heading\">Calcolatore della resa della vernice per superfici: Come calcolare quanti litri servono per l&#8217;intera casa?<\/h2>\n\n\n\n<p>Quando si dipingono diverse aree \u2014 ad esempio soggiorno, camere da letto, corridoio, porte o armadi \u2014 la domanda principale \u00e8\n    <strong>quanta vernice acquistare in totale<\/strong>. Questo calcolatore permette di aggiungere diverse aree in mq, sommarle e fornire una stima chiara\n    in base al tipo di superficie, al tipo di vernice, al metodo di pittura e al numero di mani.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Perch\u00e9 calcolare pi\u00f9 aree insieme?<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Risparmio di tempo: Compri la vernice una volta sola invece di tornare in negozio a met\u00e0 lavoro.<\/li>\n\n<li>Precisione nel budget: Sai in anticipo quanti secchi\/litri ti serviranno.<\/li>\n\n<li>Gestione del lavoro: \u00c8 pi\u00f9 facile suddividere le attivit\u00e0 per stanza e avere comunque la giusta quantit\u00e0 di vernice.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Cosa influisce sulla quantit\u00e0 di vernice?<\/h3>\n\n\n\n<p>Il consumo di vernice non dipende solo dall&#8217;area, ma anche dall&#8217;assorbenza e dalla struttura (parete ruvida\/legno non trattato), dal tipo di vernice (acqua\/olio\/epossidica),\n    e dal metodo di pittura (rullo\/pennello\/spruzzo). Pertanto, il calcolatore utilizza coefficienti di adattamento per fornire una stima pi\u00f9 realistica.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Suggerimenti per un risultato pi\u00f9 accurato<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Misura le aree in modo ordinato: lunghezza \u00d7 altezza per ogni parete e somma il totale.<\/li>\n\n<li>Scegli il numero corretto di mani: di solito 2 mani, e nei cambi netti di colore potrebbero esserne necessarie 3.<\/li>\n\n<li>Lascia un margine di sicurezza: il 10%\u201315% \u00e8 lo standard per i lavori di ritocco e finitura.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Link interni per altri strumenti utili<\/h3>\n\n\n\n<p>Sul sito troverai altri strumenti gratuiti che possono aiutarti nella pianificazione del lavoro e nella gestione delle attivit\u00e0:\n    <a href=\"\/it\/Message-Link-Generator\/\">Generatore di link WhatsApp<\/a>,\n    <a href=\"\/it\/AC-Calculation\/\">Calcolatore di aria condizionata<\/a>,\n    <a href=\"\/it\/Emoji-Finder\/\">Trova emoji<\/a>,\n    <a href=\"\/it\/Country-Flag-Finder\/\">Trova bandiere<\/a>.<\/p>\n\n\n\n<p><strong>Importante:<\/strong> Il risultato \u00e8 solo una stima. Si consiglia sempre di arrotondare per eccesso in base alle comuni confezioni di vernice e di lasciare un po&#8217; di vernice per ritocchi futuri. Lo strumento funziona solo nel browser e non salva i dati sul server.<\/p>\n\n\n\n<\/div>\n\n\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\ud83c\udf19 Modalit\u00e0 Scura Calcolatore di pittura avanzato \ud83c\udfa8 Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto. Completamente gratuito \ud83e\uddee Impostazioni di base Le impostazioni qui si applicano a tutte le aree inserite di seguito. Se ci sono superfici di natura diversa, si consiglia di calcolare separatamente. Tipo di superficie Parete interna \/ [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_yoast_wpseo_title":"\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution","_yoast_wpseo_metadesc":"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.","footnotes":"","tool_emoji":"\ud83c\udfa8","tool_category":"Calcolatrici","tool_featured":"no"},"class_list":["post-31","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution<\/title>\n<meta name=\"description\" content=\"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bsolution.me\/it\/paint-calculator-2\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution\" \/>\n<meta property=\"og:description\" content=\"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bsolution.me\/it\/paint-calculator-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Strumenti Gratuiti per le Aziende\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-27T09:00:09+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/bsolution.me\\\/it\\\/paint-calculator-2\\\/\",\"url\":\"https:\\\/\\\/bsolution.me\\\/it\\\/paint-calculator-2\\\/\",\"name\":\"\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bsolution.me\\\/it\\\/#website\"},\"datePublished\":\"2026-09-27T08:17:00+00:00\",\"dateModified\":\"2026-09-27T09:00:09+00:00\",\"description\":\"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/bsolution.me\\\/it\\\/paint-calculator-2\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/bsolution.me\\\/it\\\/paint-calculator-2\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/bsolution.me\\\/it\\\/paint-calculator-2\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/bsolution.me\\\/it\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\ud83c\udfa8 Calcolatore di pittura avanzato\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/bsolution.me\\\/it\\\/#website\",\"url\":\"https:\\\/\\\/bsolution.me\\\/it\\\/\",\"name\":\"Strumenti Gratuiti per le Aziende\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/bsolution.me\\\/it\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution","description":"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bsolution.me\/it\/paint-calculator-2\/","og_locale":"it_IT","og_type":"article","og_title":"\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution","og_description":"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.","og_url":"https:\/\/bsolution.me\/it\/paint-calculator-2\/","og_site_name":"Strumenti Gratuiti per le Aziende","article_modified_time":"2026-09-27T09:00:09+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/bsolution.me\/it\/paint-calculator-2\/","url":"https:\/\/bsolution.me\/it\/paint-calculator-2\/","name":"\ud83c\udfa8 Calcolatore di pittura avanzato | Bsolution","isPartOf":{"@id":"https:\/\/bsolution.me\/it\/#website"},"datePublished":"2026-09-27T08:17:00+00:00","dateModified":"2026-09-27T09:00:09+00:00","description":"Calcola facilmente la quantit\u00e0 di vernice necessaria per il tuo progetto.","breadcrumb":{"@id":"https:\/\/bsolution.me\/it\/paint-calculator-2\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bsolution.me\/it\/paint-calculator-2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/bsolution.me\/it\/paint-calculator-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bsolution.me\/it\/"},{"@type":"ListItem","position":2,"name":"\ud83c\udfa8 Calcolatore di pittura avanzato"}]},{"@type":"WebSite","@id":"https:\/\/bsolution.me\/it\/#website","url":"https:\/\/bsolution.me\/it\/","name":"Strumenti Gratuiti per le Aziende","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/bsolution.me\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"}]}},"_links":{"self":[{"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/pages\/31","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/comments?post=31"}],"version-history":[{"count":1,"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/pages\/31\/revisions"}],"predecessor-version":[{"id":32,"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/pages\/31\/revisions\/32"}],"wp:attachment":[{"href":"https:\/\/bsolution.me\/it\/wp-json\/wp\/v2\/media?parent=31"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}