toolbox/electricity-cost.html at main · 100millionusd/toolbox · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Free Electricity Cost Calculator — Power Bill Estimate</title>
  <meta name="description" content="Calculate electricity cost for any appliance. Watts, hours, rate. Monthly and yearly estimates. Free online electricity cost calculator.">
  <link rel="canonical" href="https://www.quicktools.mom/electricity-cost.html">
  <meta property="og:title" content="Electricity Cost Calculator"><meta property="og:type" content="website"><meta property="og:url" content="https://www.quicktools.mom/electricity-cost.html"><meta name="twitter:card" content="summary">
  <script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","mainEntity":[{"@type":"Question","name":"How do I calculate electricity cost?","acceptedAnswer":{"@type":"Answer","text":"Multiply watts × hours used per day ÷ 1000 to get kWh, then multiply by your electricity rate. This calculator does it automatically."}},{"@type":"Question","name":"How much does it cost to run an appliance?","acceptedAnswer":{"@type":"Answer","text":"A 100W light bulb running 8 hours at $0.12/kWh costs about $0.10/day or $2.88/month."}}]}</script>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <div class="page-wrapper">
    <header class="site-header"><a href="index.html" class="site-logo"><span class="icon">⚡</span> QuickTools</a><nav class="site-nav"><a href="index.html">All Tools</a></nav></header>
    <div class="ad-zone ad-zone-top">Ad Space</div>
    <div class="tool-header"><div class="tool-badge">🏠 Home & DIY</div><h1>Electricity Cost Calculator</h1><p>How much does it cost to run any appliance? Calculate daily, monthly, yearly.</p></div>
    <div class="tool-card">
      <div class="controls-row">
        <div class="control-group"><label>Power (Watts)</label><input type="number" id="watts" value="100" oninput="calc()"></div>
        <div class="control-group"><label>Hours per Day</label><input type="number" id="hours" value="8" step="0.5" oninput="calc()"></div>
        <div class="control-group"><label>Rate ($/kWh)</label><input type="number" id="rate" value="0.12" step="0.01" oninput="calc()"></div>
      </div>
      <div style="display:flex;gap:0.3rem;margin-top:0.5rem;flex-wrap:wrap;">
        <button class="btn btn-secondary" onclick="setWatts(10,'LED Bulb')" style="font-size:0.7rem;">💡 LED 10W</button>
        <button class="btn btn-secondary" onclick="setWatts(60,'Light Bulb')" style="font-size:0.7rem;">💡 Bulb 60W</button>
        <button class="btn btn-secondary" onclick="setWatts(150,'TV')" style="font-size:0.7rem;">📺 TV 150W</button>
        <button class="btn btn-secondary" onclick="setWatts(300,'Desktop PC')" style="font-size:0.7rem;">💻 PC 300W</button>
        <button class="btn btn-secondary" onclick="setWatts(1500,'AC Unit')" style="font-size:0.7rem;">❄️ AC 1500W</button>
        <button class="btn btn-secondary" onclick="setWatts(2000,'Space Heater')" style="font-size:0.7rem;">🔥 Heater 2kW</button>
        <button class="btn btn-secondary" onclick="setWatts(5000,'EV Charger')" style="font-size:0.7rem;">🔌 EV 5kW</button>
      </div>
    </div>
    <div class="tool-card" style="text-align:center;">
      <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;">
        <div style="padding:1.5rem;background:var(--bg-secondary);border-radius:12px;"><div style="font-size:0.75rem;color:var(--text-muted);">Daily</div><div id="daily" style="font-size:1.8rem;font-weight:700;">$0</div><div id="kwh" style="font-size:0.75rem;color:var(--text-muted);">0 kWh</div></div>
        <div style="padding:1.5rem;background:var(--bg-secondary);border-radius:12px;"><div style="font-size:0.75rem;color:var(--text-muted);">Monthly</div><div id="monthly" style="font-size:1.8rem;font-weight:700;color:var(--accent);">$0</div><div id="kwhM" style="font-size:0.75rem;color:var(--text-muted);">0 kWh</div></div>
        <div style="padding:1.5rem;background:var(--bg-secondary);border-radius:12px;"><div style="font-size:0.75rem;color:var(--text-muted);">Yearly</div><div id="yearly" style="font-size:1.8rem;font-weight:700;">$0</div><div id="kwhY" style="font-size:0.75rem;color:var(--text-muted);">0 kWh</div></div>
      </div>
    </div>
    <div class="tool-card" style="max-width:720px;">
      <h2 style="font-size:1rem;margin-bottom:0.75rem;">📖 About Electricity Cost Calculator</h2>
      <p style="font-size:0.85rem;line-height:1.7;color:var(--text-muted);">This electricity cost calculator estimates how much any appliance costs to run. Enter the wattage, daily usage hours, and your electricity rate (found on your power bill). The tool calculates daily, monthly, and yearly costs plus energy consumption in kWh. Quick-select buttons let you estimate common appliances like LED bulbs, TVs, computers, AC units, space heaters, and EV chargers. Perfect for homeowners auditing energy usage, renters estimating bills, and anyone trying to reduce electricity costs. Compare appliances side by side to find which ones cost the most. Everything runs privately in your browser. The appliance preset buttons make it easy to estimate costs for the most common household devices without looking up wattages. Compare an LED bulb versus an incandescent to see annual savings.</p>
      <h3 style="font-size:0.9rem;margin-bottom:0.5rem;">How to Use</h3>
      <ol style="font-size:0.85rem;color:var(--text-muted);line-height:1.7;padding-left:1.2rem;">
        <li><strong>Enter wattage</strong> — Check the label on your appliance or use a preset.</li>
        <li><strong>Set hours per day</strong> — How long you run it daily.</li>
        <li><strong>Enter your rate</strong> — Find it on your electric bill ($/kWh).</li>
        <li><strong>See the cost</strong> — Daily, monthly, and yearly breakdowns.</li>
      </ol>
    </div>
    <div class="ad-zone">Ad Space</div>
    <div class="related-tools"><h2>Related Tools</h2><div class="related-grid"><a href="paint-calculator.html"><span class="tool-icon">🎨</span> Paint</a><a href="unit-converter.html"><span class="tool-icon">📏</span> Units</a><a href="percentage-calculator.html"><span class="tool-icon">%</span> Percentage</a><a href="salary-calculator.html"><span class="tool-icon">💰</span> Salary</a></div></div>
    <div class="ad-zone ad-zone-bottom">Ad Space</div>
    <footer class="site-footer"><p>&copy; 2026 QuickTools.</p><div class="footer-links"><a href="index.html">All Tools</a></div></footer>
  </div>
  <script>
    function setWatts(w){document.getElementById('watts').value=w;calc();}
    function calc(){const w=+document.getElementById('watts').value;const h=+document.getElementById('hours').value;const r=+document.getElementById('rate').value;
      const dailyKwh=w*h/1000;const dailyCost=dailyKwh*r;
      document.getElementById('daily').textContent='$'+dailyCost.toFixed(2);document.getElementById('kwh').textContent=dailyKwh.toFixed(2)+' kWh';
      document.getElementById('monthly').textContent='$'+(dailyCost*30).toFixed(2);document.getElementById('kwhM').textContent=(dailyKwh*30).toFixed(1)+' kWh';
      document.getElementById('yearly').textContent='$'+(dailyCost*365).toFixed(0);document.getElementById('kwhY').textContent=(dailyKwh*365).toFixed(0)+' kWh';
    }
    calc();
  </script>
<script src="ads.js"></script>
</body>
</html>