diff --git a/assets/coffee/index.coffee b/assets/coffee/index.coffee
index 4a4a7cc..75f3463 100644
--- a/assets/coffee/index.coffee
+++ b/assets/coffee/index.coffee
@@ -3,6 +3,22 @@ si = require('systeminformation')
 window.onload = () ->
   si.cpu()
     .then((data) ->
+      document.getElementById('cpuInfo').innerText = data.brand
+      console.log(data)
+    ).catch((error) ->
+      console.error(error)
+    )
+  si.cpuTemperature()
+    .then((data) ->
+      document.getElementById('cpuTemp').innerText = data.main
+      console.log(data)
+    ).catch((error) ->
+      console.error(error)
+    )
+
+  si.graphics()
+    .then((data) ->
+      document.getElementById('gpuInfo').innerText = data.controllers[0].model
       console.log(data)
     ).catch((error) ->
       console.error(error)
diff --git a/assets/twig/index.twig b/assets/twig/index.twig
index 77c872b..ac2f251 100644
--- a/assets/twig/index.twig
+++ b/assets/twig/index.twig
@@ -12,4 +12,28 @@
   </div>
 </header>
 
+<section class="row">
+  <table class="columns twelve">
+    <thead>
+      <tr>
+        <th>HW Type</th>
+        <th>Hardware Model Info.</th>
+        <th>Current Temp.</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td>CPU</td>
+        <td id="cpuInfo"></td>
+        <td id="cpuTemp"></td>
+      </tr>
+      <tr>
+        <td>GPU</td>
+        <td id="gpuInfo"></td>
+        <td id="gpuTemp"></td>
+      </tr>
+    </tbody>
+  </table>
+</section>
+
 {% endblock %}