{"id":30,"date":"2026-09-27T08:17:07","date_gmt":"2026-09-27T08:17:07","guid":{"rendered":"https:\/\/bsolution.me\/tr\/paint-calculator-4\/"},"modified":"2026-09-27T09:00:30","modified_gmt":"2026-09-27T09:00:30","slug":"paint-calculator-2","status":"publish","type":"page","link":"https:\/\/bsolution.me\/tr\/paint-calculator-2\/","title":{"rendered":"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131"},"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 Karanl\u0131k Mod<\/button><\/div>\n\n\n\n<header>\n<h2 class=\"main-title\">Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 <span class=\"icon pill\">\ud83c\udfa8<\/span><\/h2>\n<p class=\"subtitle\">Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.<\/p>\n<div class=\"free-badge\"><span class=\"free-dot\"><\/span> Tamamen \u00dccretsiz<\/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: right;\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 Temel Ayarlar<\/div>\n<p class=\"section-subtitle\">Buradaki ayarlar a\u015fa\u011f\u0131da girdi\u011finiz t\u00fcm alanlar i\u00e7in ge\u00e7erlidir. \u00d6zellikleri farkl\u0131 olan y\u00fczeyler varsa ayr\u0131 ayr\u0131 hesaplanmas\u0131 \u00f6nerilir.<\/p>\n<div class=\"input-group\">\n<label for=\"paint-surface\">Y\u00fczey T\u00fcr\u00fc<\/label>\n<select id=\"paint-surface\">\n<option selected=\"\" value=\"wall_interior\">\u0130\u00e7 duvar \/ tavan (s\u0131va\/beton)<\/option>\n<option value=\"wall_exterior\">P\u00fcr\u00fczl\u00fc d\u0131\u015f duvar<\/option>\n<option value=\"deck_wood\">G\u00fcverte \/ d\u0131\u015f ah\u015fap y\u00fczey<\/option>\n<option value=\"furniture_wood\">Dolap \/ ah\u015fap mobilya<\/option>\n<option value=\"metal\">Metal y\u00fczey<\/option>\n<option value=\"floor_epoxy\">Zemin (zemin boyas\u0131 \/ epoksi)<\/option>\n<\/select>\n<\/div>\n<div class=\"input-group\">\n<label for=\"paint-type\">Boya T\u00fcr\u00fc<\/label>\n<select id=\"paint-type\">\n<option selected=\"\" value=\"water_wall\">Duvarlar i\u00e7in su bazl\u0131 \/ akrilik boya<\/option>\n<option value=\"oil_wall\">Ya\u011fl\u0131 boya<\/option>\n<option value=\"wood_water\">Ah\u015fap i\u00e7in su bazl\u0131 boya \/ vernik<\/option>\n<option value=\"wood_oil\">Ah\u015fap i\u00e7in ya\u011f bazl\u0131 boya \/ vernik<\/option>\n<option value=\"metal_enamel\">Emaye \/ metal boyas\u0131<\/option>\n<option value=\"epoxy\">\u00c7ift bile\u015fenli epoksi<\/option>\n<option value=\"spray_can\">Sprey (kutu)<\/option>\n<\/select>\n<\/div>\n<div class=\"input-group\">\n<label for=\"paint-coats\">Planlanan Kat Say\u0131s\u0131<\/label>\n<input id=\"paint-coats\" inputmode=\"numeric\" min=\"1\" step=\"1\" type=\"number\" value=\"2\"\/>\n<div class=\"error-msg\" id=\"coats-err\">L\u00fctfen ge\u00e7erli bir kat say\u0131s\u0131 girin (1 veya daha fazla).<\/div>\n<\/div>\n<\/div>\n<details>\n<summary>\u2699\ufe0f Geli\u015fmi\u015f Ayarlar<\/summary>\n<div style=\"margin-top: 15px;\">\n<div class=\"input-group\">\n<label for=\"paint-safety\">G\u00fcvenlik Pay\u0131 (%)<\/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;\">Onar\u0131mlar i\u00e7in at\u0131k pay\u0131 b\u0131rak\u0131lmas\u0131 \u00f6nerilir (%10-%15).<\/p>\n<\/div>\n<div class=\"input-group\">\n<label>Emicilik \/ Y\u00fczey Dokusu<\/label>\n<div class=\"chips\" id=\"texture-chips\">\n<button class=\"chip active\" data-val=\"smooth\" type=\"button\">P\u00fcr\u00fczs\u00fcz \/ emici olmayan<\/button>\n<button class=\"chip\" data-val=\"normal\" type=\"button\">Normal<\/button>\n<button class=\"chip\" data-val=\"rough\" type=\"button\">P\u00fcr\u00fczl\u00fc \/ emici<\/button>\n<\/div>\n<\/div>\n<div class=\"input-group\">\n<label>Boya Y\u00f6ntemi<\/label>\n<div class=\"chips\" id=\"method-chips\">\n<button class=\"chip active\" data-val=\"roller\" type=\"button\">Rulo<\/button>\n<button class=\"chip\" data-val=\"brush\" type=\"button\">F\u0131r\u00e7a<\/button>\n<button class=\"chip\" data-val=\"spray_gun\" type=\"button\">P\u00fcsk\u00fcrtme (pistole)<\/button>\n<button class=\"chip\" data-val=\"spray_can\" type=\"button\">Sprey kutusu<\/button>\n<\/div>\n<\/div>\n<\/div>\n<\/details>\n<div>\n<div class=\"section-title\">\ud83d\udcd0 Hesaplanacak Alanlar<\/div>\n<p class=\"section-subtitle\">Boyanacak t\u00fcm alanlar\u0131 metrekare (m\u00b2) cinsinden girin. Farkl\u0131 duvarlar ve odalar ekleyebilirsiniz.<\/p>\n<div class=\"buttons-row\">\n<button class=\"btn btn-secondary\" id=\"add-area-btn\" type=\"button\">\u2795 Alan Ekle<\/button>\n<button class=\"btn btn-secondary\" id=\"clear-areas-btn\" type=\"button\">\ud83d\uddd1\ufe0f Hepsini Temizle<\/button>\n<\/div>\n<div class=\"areas-list\" id=\"areas-list\">\n<\/div>\n<div class=\"error-msg\" id=\"areas-err\">L\u00fctfen ge\u00e7erli en az bir alan girin (0 m\u00b2&#8217;den fazla).<\/div>\n<\/div>\n<button class=\"btn btn-primary\" id=\"calc-btn\" type=\"button\">Boya Miktar\u0131n\u0131 Hesapla<\/button>\n<div class=\"result-panel\" id=\"result-panel\" style=\"display: none;\">\n<div class=\"section-title\">Sizin \u0130\u00e7in \u00d6nerilen Miktar:<\/div>\n<div class=\"result-value\">\n<span id=\"result-liters\">0.00<\/span>\n<span class=\"result-unit\">Litre<\/span>\n<\/div>\n<p id=\"result-subtitle\" style=\"margin: 0;\">G\u00fcvenlik pay\u0131 dahildir.<\/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>Alan Ad\u0131 (\u0130ste\u011fe ba\u011fl\u0131)<\/label>\n            <input type=\"text\" class=\"area-name\" placeholder=\"\u00d6rn: Salon\" value=\"${name}\">\n          <\/div>\n          <div class=\"input-group\" style=\"margin: 0;\">\n            <label>Alan (m\u00b2)<\/label>\n            <input type=\"number\" class=\"area-val\" min=\"0\" step=\"0.1\" placeholder=\"\u00d6rn: 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=\"Alan\u0131 Sil\">\u2715 Sil<\/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>Hesaplama Ayr\u0131nt\u0131lar\u0131:<\/strong><br>\n          Toplam Alan: <strong>\\${totalArea.toFixed(1)} m\u00b2<\/strong><br>\n          Kat Say\u0131s\u0131: <strong>\\${coats}<\/strong><br>\n          Y\u00fczey T\u00fcr\u00fc: <strong>\\${surfaceText}<\/strong><br>\n          Boya T\u00fcr\u00fc: <strong>\\${paintText}<\/strong><br>\n          Tahmini Temel Kapsama Alan\u0131: <strong>\\${cov.toFixed(1)} m\u00b2\/litre<\/strong><br>\n          Etkili Kapsama Alan\u0131 (katsay\u0131lardan sonra): <strong>\\${effCoverage.toFixed(1)} m\u00b2\/litre<\/strong><br>\n          Eklenen G\u00fcvenlik Pay\u0131: <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\">Y\u00fczeyler \u0130\u00e7in Boya T\u00fcketimi Hesaplay\u0131c\u0131: T\u00fcm Ev \u0130\u00e7in Ka\u00e7 Litre Gerekti\u011fi Nas\u0131l Hesaplan\u0131r?<\/h2>\n\n\n\n<p>Farkl\u0131 birka\u00e7 alan boyan\u0131rken \u2014 \u00f6rne\u011fin oturma odas\u0131, yatak odalar\u0131, koridor, kap\u0131lar veya dolaplar \u2014 temel soru \u015fudur:\n    <strong>toplamda ne kadar boya al\u0131nmal\u0131<\/strong>. Bu hesaplay\u0131c\u0131, birka\u00e7 alan\u0131 m\u00b2 cinsinden eklemenizi, bunlar\u0131 toplaman\u0131z\u0131 ve\n    y\u00fczey t\u00fcr\u00fcne, boya t\u00fcr\u00fcne, boyama y\u00f6ntemine ve kat say\u0131s\u0131na g\u00f6re net bir tahmin olu\u015fturman\u0131z\u0131 sa\u011flar.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Neden birka\u00e7 alan\u0131 birlikte hesaplamal\u0131s\u0131n\u0131z?<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Zaman tasarrufu: \u0130\u015fin ortas\u0131nda ma\u011fazaya d\u00f6nmek yerine boyay\u0131 bir kez al\u0131rs\u0131n\u0131z.<\/li>\n\n<li>B\u00fct\u00e7ede do\u011fruluk: Ka\u00e7 kova\/litre gerekti\u011fini \u00f6nceden bilirsiniz.<\/li>\n\n<li>\u0130\u015f y\u00f6netimi: G\u00f6revleri odalara g\u00f6re b\u00f6lmek ve yine de do\u011fru miktarda boya ile kalmak daha kolayd\u0131r.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Boya miktar\u0131n\u0131 ne etkiler?<\/h3>\n\n\n\n<p>Boya t\u00fcketimi yaln\u0131zca alana de\u011fil, ayn\u0131 zamanda emicili\u011fe ve dokuya (p\u00fcr\u00fczl\u00fc duvar\/i\u015flenmemi\u015f ah\u015fap), boya t\u00fcr\u00fcne (su\/ya\u011f\/epoksi) ve boyama y\u00f6ntemine (rulo\/f\u0131r\u00e7a\/sprey) de ba\u011fl\u0131d\u0131r. Bu nedenle hesaplay\u0131c\u0131, daha ger\u00e7ek\u00e7i bir tahmin vermek i\u00e7in ayarlama katsay\u0131lar\u0131n\u0131 kullan\u0131r.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Daha do\u011fru bir sonu\u00e7 i\u00e7in ipu\u00e7lar\u0131<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Alanlar\u0131 d\u00fczenli bir \u015fekilde \u00f6l\u00e7\u00fcn: Her duvar i\u00e7in uzunluk \u00d7 y\u00fckseklik ve toplay\u0131n.<\/li>\n\n<li>Do\u011fru kat say\u0131s\u0131n\u0131 se\u00e7in: Genellikle 2 kat ve keskin renk ge\u00e7i\u015flerinde 3 olabilir.<\/li>\n\n<li>G\u00fcvenlik pay\u0131 b\u0131rak\u0131n: Onar\u0131m ve cila i\u015fleri i\u00e7in %10-%15 standartt\u0131r.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Di\u011fer Faydal\u0131 Ara\u00e7lar \u0130\u00e7in \u0130\u00e7 Ba\u011flant\u0131lar<\/h3>\n\n\n\n<p>Sitede, i\u015f planlamas\u0131 ve g\u00f6rev y\u00f6netimine yard\u0131mc\u0131 olabilecek ba\u015fka \u00fccretsiz ara\u00e7lar bulabilirsiniz:\n    <a href=\"\/tr\/Message-Link-Generator\/\">WhatsApp Ba\u011flant\u0131 Olu\u015fturucu<\/a>,\n    <a href=\"\/tr\/AC-Calculation\/\">Oda Klima Hesaplay\u0131c\u0131<\/a>,\n    <a href=\"\/tr\/Emoji-Finder\/\">Emoji Bulucu<\/a>,\n    <a href=\"\/tr\/Country-Flag-Finder\/\">Bayrak Bulucu<\/a>.<\/p>\n\n\n\n<p><strong>Bilmeniz gerekenler:<\/strong> Sonu\u00e7 sadece bir tahmindir. Ortak boya paketlerine g\u00f6re her zaman yukar\u0131 yuvarlaman\u0131z ve gelecekteki onar\u0131mlar i\u00e7in bir miktar b\u0131rakman\u0131z \u00f6nerilir. Ara\u00e7 yaln\u0131zca taray\u0131c\u0131da \u00e7al\u0131\u015f\u0131r ve veriler sunucuya kaydedilmez.<\/p>\n\n\n\n<\/div>\n\n\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\ud83c\udf19 Karanl\u0131k Mod Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 \ud83c\udfa8 Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n. Tamamen \u00dccretsiz \ud83e\uddee Temel Ayarlar Buradaki ayarlar a\u015fa\u011f\u0131da girdi\u011finiz t\u00fcm alanlar i\u00e7in ge\u00e7erlidir. \u00d6zellikleri farkl\u0131 olan y\u00fczeyler varsa ayr\u0131 ayr\u0131 hesaplanmas\u0131 \u00f6nerilir. Y\u00fczey T\u00fcr\u00fc \u0130\u00e7 duvar \/ tavan (s\u0131va\/beton)P\u00fcr\u00fczl\u00fc d\u0131\u015f duvarG\u00fcverte \/ d\u0131\u015f ah\u015fap y\u00fczeyDolap \/ ah\u015fap mobilyaMetal y\u00fczeyZemin (zemin boyas\u0131 [&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 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution","_yoast_wpseo_metadesc":"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.","footnotes":"","tool_emoji":"\ud83c\udfa8","tool_category":"Hesap Makineleri","tool_featured":"no"},"class_list":["post-30","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 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution<\/title>\n<meta name=\"description\" content=\"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.\" \/>\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\/tr\/paint-calculator-2\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution\" \/>\n<meta property=\"og:description\" content=\"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bsolution.me\/tr\/paint-calculator-2\/\" \/>\n<meta property=\"og:site_name\" content=\"\u0130\u015fletmeler \u0130\u00e7in \u00dccretsiz Ara\u00e7lar\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-27T09:00:30+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 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/paint-calculator-2\\\/\",\"url\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/paint-calculator-2\\\/\",\"name\":\"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/#website\"},\"datePublished\":\"2026-09-27T08:17:07+00:00\",\"dateModified\":\"2026-09-27T09:00:30+00:00\",\"description\":\"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/paint-calculator-2\\\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/bsolution.me\\\/tr\\\/paint-calculator-2\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/paint-calculator-2\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/#website\",\"url\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/\",\"name\":\"\u0130\u015fletmeler \u0130\u00e7in \u00dccretsiz Ara\u00e7lar\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/bsolution.me\\\/tr\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution","description":"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.","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\/tr\/paint-calculator-2\/","og_locale":"tr_TR","og_type":"article","og_title":"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution","og_description":"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.","og_url":"https:\/\/bsolution.me\/tr\/paint-calculator-2\/","og_site_name":"\u0130\u015fletmeler \u0130\u00e7in \u00dccretsiz Ara\u00e7lar","article_modified_time":"2026-09-27T09:00:30+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/bsolution.me\/tr\/paint-calculator-2\/","url":"https:\/\/bsolution.me\/tr\/paint-calculator-2\/","name":"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131 | Bsolution","isPartOf":{"@id":"https:\/\/bsolution.me\/tr\/#website"},"datePublished":"2026-09-27T08:17:07+00:00","dateModified":"2026-09-27T09:00:30+00:00","description":"Projeniz i\u00e7in gereken boya miktar\u0131n\u0131 kolayca hesaplay\u0131n.","breadcrumb":{"@id":"https:\/\/bsolution.me\/tr\/paint-calculator-2\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bsolution.me\/tr\/paint-calculator-2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/bsolution.me\/tr\/paint-calculator-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bsolution.me\/tr\/"},{"@type":"ListItem","position":2,"name":"\ud83c\udfa8 Geli\u015fmi\u015f Boya Hesaplay\u0131c\u0131"}]},{"@type":"WebSite","@id":"https:\/\/bsolution.me\/tr\/#website","url":"https:\/\/bsolution.me\/tr\/","name":"\u0130\u015fletmeler \u0130\u00e7in \u00dccretsiz Ara\u00e7lar","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/bsolution.me\/tr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"}]}},"_links":{"self":[{"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/pages\/30","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/comments?post=30"}],"version-history":[{"count":1,"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/pages\/30\/revisions"}],"predecessor-version":[{"id":31,"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/pages\/30\/revisions\/31"}],"wp:attachment":[{"href":"https:\/\/bsolution.me\/tr\/wp-json\/wp\/v2\/media?parent=30"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}