diff --git a/module/applications/sheets/actors/character.mjs b/module/applications/sheets/actors/character.mjs
index 7b958efa..e035cc85 100644
--- a/module/applications/sheets/actors/character.mjs
+++ b/module/applications/sheets/actors/character.mjs
@@ -20,6 +20,7 @@ export default class CharacterSheet extends DHBaseActorSheet {
             toggleVault: CharacterSheet.#toggleVault,
             rollAttribute: CharacterSheet.#rollAttribute,
             toggleHitPoints: CharacterSheet.#toggleHitPoints,
+            toggleStress: CharacterSheet.#toggleStress,
             toggleHope: CharacterSheet.#toggleHope,
             toggleLoadoutView: CharacterSheet.#toggleLoadoutView,
             openPack: CharacterSheet.#openPack,
@@ -729,7 +730,7 @@ export default class CharacterSheet extends DHBaseActorSheet {
     }
 
     /**
-     * Toggles a hitpoint resource value.
+     * Toggles hitpoint resource value.
      * @type {ApplicationClickAction}
      */
     static async #toggleHitPoints(_, button) {
@@ -738,6 +739,16 @@ export default class CharacterSheet extends DHBaseActorSheet {
         await this.document.update({ 'system.resources.hitPoints.value': newValue });
     }
 
+    /**
+     * Toggles stress resource value.
+     * @type {ApplicationClickAction}
+     */
+    static async #toggleStress(_, button) {
+        const StressValue = Number.parseInt(button.dataset.value);
+        const newValue = this.document.system.resources.stress.value >= StressValue ? StressValue - 1 : StressValue;
+        await this.document.update({ 'system.resources.stress.value': newValue });
+    }
+
     /**
      * Toggles a hope resource value.
      * @type {ApplicationClickAction}
diff --git a/templates/sheets/actors/character/sidebar.hbs b/templates/sheets/actors/character/sidebar.hbs
index 1f7d5b55..0cd11d15 100644
--- a/templates/sheets/actors/character/sidebar.hbs
+++ b/templates/sheets/actors/character/sidebar.hbs
@@ -24,15 +24,11 @@
                             <span class='slot {{#if (gte ../document.system.resources.hitPoints.value (add this 1))}}filled{{/if}}' data-action='toggleHitPoints' data-value="{{add this 1}}">
                             </span>
                         {{/times}}
-                    </div> {{!--
-                    <p><input class="bar-input" name="system.resources.hitPoints.value" min="0" max='{{document.system.resources.hitPoints.max}}'
-                            value="{{document.system.resources.hitPoints.value}}" type="number"></p>
-                    <p>/</p>
-                    <p class="bar-label">{{document.system.resources.hitPoints.max}}</p> --}}
+                    </div>
+                </div>
+                <div class='progress-bar'>
+
                 </div>
-                <div
-                    class='progress-bar'
-                ></div>
                 <div class="status-label">
                     <h4><span>{{localize "DAGGERHEART.GENERAL.HitPoints.short"}}</span><span>|</span>
                     <span>{{document.system.resources.hitPoints.value}} / {{document.system.resources.hitPoints.max}}</span></h4>
@@ -41,19 +37,17 @@
             </div>
             <div class="status-bar">
                 <div class='status-value'>
-                    <p><input class="bar-input" name="system.resources.stress.value" min="0" max='{{document.system.resources.stress.max}}'
-                            value="{{document.system.resources.stress.value}}" type="number"></p>
-                    <p>/</p>
-                    <p class="bar-label">{{document.system.resources.stress.max}}</p>
+                    <div class="slot-bar">
+                        {{#times document.system.resources.stress.max}}
+                            <span class='slot {{#if (gte ../document.system.resources.stress.value (add this 1))}}filled{{/if}}' data-action='toggleStress' data-value="{{add this 1}}">
+                            </span>
+                        {{/times}}
+                    </div>
                 </div>
-                <progress
-                    class='progress-bar stress-color'
-                    value='{{document.system.resources.stress.value}}'
-                    min="0"
-                    max='{{document.system.resources.stress.max}}'
-                ></progress>
+                <div class="progress-bar"></div>
                 <div class="status-label">
-                    <h4>{{localize "DAGGERHEART.GENERAL.stress"}}</h4>
+                    <h4>{{localize "DAGGERHEART.GENERAL.stress"}}</span><span>|</span>
+                    <span>{{document.system.resources.stress.value}} / {{document.system.resources.stress.max}}</span></h4>
                 </div>
             </div>
         </div>