diff --git a/assets/roll.js b/assets/roll.js
index 973c42a..f676e95 100644
--- a/assets/roll.js
+++ b/assets/roll.js
@@ -14,10 +14,11 @@ function roll(type) {
 async function rollDualityDice() {
     const modifier = parseInt(document.getElementById("modifier").value) || 0;
     const advDisadv = document.getElementById("adv-disadv").value;
+    const replaceHopeWithD20 = document.getElementById("hope-d20-toggle").checked;
 
     // Define the dice groups
     const diceGroups = [
-        { name: "Hope", roll: "1d12", color: "yellow" },
+        { name: "Hope", roll: replaceHopeWithD20 ? "1d20" : "1d12", color: "yellow" },
         { name: "Fear", roll: "1d12", color: "purple" }
     ];
 
diff --git a/roll.html b/roll.html
index 5c8f72e..3d7ffa7 100644
--- a/roll.html
+++ b/roll.html
@@ -26,6 +26,10 @@
             <option value="disadvantage">Disadvantage</option>
         </select>
     </div>
+    <div class="content-row">
+        <label class="field-title" for="hope-d20-toggle">Replace Hope D12 with D20</label>
+        <input id="hope-d20-toggle" type="checkbox"></input>
+    </div>
     <div class="content-row">
         <span class="spacer"></span>
         <button id="roll-duality" onclick="rollDualityDice()">Roll Duality Dice</button>