diff --git a/app.js b/app.js
index 9c14b1d..961ce94 100644
--- a/app.js
+++ b/app.js
@@ -42,14 +42,6 @@ function getHasher(hashType) {
 (async () => {
   await init()
 
-  document.getElementById("advanced-options").addEventListener("change", e => {
-    if (e.target.checked) {
-      document.body.classList.add("advanced")
-    } else {
-      document.body.classList.remove("advanced")
-    }
-  })
-
   document.getElementById("generate").addEventListener("click", e => {
     e.target.disabled = true
     const buttonText = e.target.innerText
diff --git a/index.html b/index.html
index 2bd67e6..a2bb27b 100644
--- a/index.html
+++ b/index.html
@@ -18,14 +18,13 @@
         <input name="hash-type" type="radio" value="bcrypt" checked>bcrypt</input>
         <input name="hash-type" type="radio" value="sha512crypt">SHA512-crypt</input><br>
 
-        <input id="advanced-options" name="advanced" type="checkbox">Advanced options</input><br>
-
-        <div class="advanced">
+        <details>
+          <summary>Advanced options</summary>
           <label for="bcrypt-cost">bcrpyt cost factor</label>
           <input name="bcrypt-cost" type="number" value="12" min="4" max="31"></input><br>
           <label for="sha512crypt-rounds">SHA512-crypt rounds</label>
           <input name="sha512crypt-rounds" type="number" value="100000" min="1000" max="999999999"></input><br>
-        </div>
+        </details>
 
         <button type="button" id="generate">Generate</button>
       </form>
diff --git a/style.css b/style.css
index 4656e46..78309ab 100644
--- a/style.css
+++ b/style.css
@@ -18,11 +18,3 @@
   font-family: monospace;
   line-break: anywhere;
 }
-
-body .advanced {
-  display: none;
-}
-
-body.advanced .advanced {
-  display: initial;
-}