diff --git a/index.html b/index.html
index 8969a25..41856c1 100644
--- a/index.html
+++ b/index.html
@@ -23,7 +23,8 @@
             </a>
         </nav>
         <nav id="theme-nav">
-            <button id="theme-button">Light Mode</button>
+            <button id="theme-button" class="theme-button">
+            </button>
         </nav>
     </header>
     <main class="uutis-lista">
diff --git a/static/styles.css b/static/styles.css
index 61057e5..092bb6e 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -70,4 +70,16 @@ header {
     gap: 200px;
     font-size: 0.9em;
     align-items: center;
+}
+
+.theme-button {
+    border: none;
+    background: none;
+}
+
+.theme-button .dark- {
+    filter: invert(0);
+}
+.theme-button .light {
+    filter: invert(1);
 }
\ No newline at end of file
diff --git a/static/theme.js b/static/theme.js
index 11b3457..30608cb 100644
--- a/static/theme.js
+++ b/static/theme.js
@@ -7,6 +7,9 @@ const setTheme = (theme) => {
 
   if (theme === 'dark') {
     html.setAttribute('data-theme', 'dark');
+    themeButton.innerHTML = "<img src='/static/aurinko.svg' class='light' />"
+  } else {
+    themeButton.innerHTML = "<img src='/static/kuu.svg' class='dark' />"
   }
 
   localStorage.setItem('theme', theme);