diff --git a/D&D_5e_Shaped/precompiled/components/npc/abilities.html b/D&D_5e_Shaped/precompiled/components/npc/abilities.html
index c12bb55cfd..7bac217838 100644
--- a/D&D_5e_Shaped/precompiled/components/npc/abilities.html
+++ b/D&D_5e_Shaped/precompiled/components/npc/abilities.html
@@ -1,6 +1,11 @@
 <div class="shaped-row">
   <div class="col-15 center">
-    <div class="heading uppercase">{{'ABILITIES.strength.SHORT_NAME' | translate}}</div>
+    <button type="roll" name="roll_strength_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=Strength}} {{subheader=Ability Check}} {{roll_toggle=1}} {{roll1=[[d20@{d20_mod} + @{strength_check_mod}]]}} @{roll_setting}@{d20_mod} + @{strength_check_mod}]]}} @{attacher_strength_check}" tabindex="-1">
+
+      <div class="heading uppercase">
+        {{'ABILITIES.strength.SHORT_NAME' | translate}}
+      </div>
+    </button>
     <div class="shaped-row center">
       <div class="col-40">
         <input type="number" name="attr_strength" class="no-border no-spin" accept="STR">
@@ -12,7 +17,11 @@
     </div>
   </div>
   <div class="col-15 center">
-    <div class="heading uppercase">{{'ABILITIES.dexterity.SHORT_NAME' | translate}}</div>
+    <button type="roll" name="roll_dexterity_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=Dexterity}} {{subheader=Ability check}} {{roll_toggle=1}} {{roll1=[[d20@{d20_mod} + @{dexterity_check_mod}]]}} @{roll_setting}@{d20_mod} + @{dexterity_check_mod}]]}} @{attacher_dexterity_check}" tabindex="-1">
+      <div class="heading uppercase">
+        {{'ABILITIES.dexterity.SHORT_NAME' | translate}}
+      </div>
+    </button>
     <div class="shaped-row center">
       <div class="col-40">
         <input type="number" name="attr_dexterity" class="no-border no-spin" accept="DEX">
@@ -24,7 +33,11 @@
     </div>
   </div>
   <div class="col-15 center">
-    <div class="heading uppercase">{{'ABILITIES.constitution.SHORT_NAME' | translate}}</div>
+    <button type="roll" name="roll_constitution_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=Constitution}} {{subheader=Ability check}} {{roll_toggle=1}} {{roll1=[[d20@{d20_mod} + @{constitution_check_mod}]]}} @{roll_setting}@{d20_mod} + @{constitution_check_mod}]]}} @{attacher_constitution_check}" tabindex="-1">
+      <div class="heading uppercase">
+        {{'ABILITIES.constitution.SHORT_NAME' | translate}}
+      </div>
+    </button>
     <div class="shaped-row center">
       <div class="col-40">
         <input type="number" name="attr_constitution" class="no-border no-spin" accept="CON">
@@ -36,7 +49,11 @@
     </div>
   </div>
   <div class="col-15 center">
-    <div class="heading uppercase">{{'ABILITIES.intelligence.SHORT_NAME' | translate}}</div>
+    <button type="roll" name="roll_intelligence_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=Intelligence}} {{subheader=Ability check}} {{roll_toggle=1}} {{roll1=[[d20@{d20_mod} + @{intelligence_check_mod}]]}} @{roll_setting}@{d20_mod} + @{intelligence_check_mod}]]}} @{attacher_intelligence_check}" tabindex="-1">
+      <div class="heading uppercase">
+        {{'ABILITIES.intelligence.SHORT_NAME' | translate}}
+      </div>
+    </button>
     <div class="shaped-row center">
       <div class="col-40">
         <input type="number" name="attr_intelligence" class="no-border no-spin" accept="INT">
@@ -48,7 +65,11 @@
     </div>
   </div>
   <div class="col-15 center">
-    <div class="heading uppercase">{{'ABILITIES.wisdom.SHORT_NAME' | translate}}</div>
+    <button type="roll" name="roll_wisdom_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=Wisdom}} {{subheader=Ability check}} {{roll_toggle=1}} {{roll1=[[d20@{d20_mod} + @{wisdom_check_mod}]]}} @{roll_setting}@{d20_mod} + @{wisdom_check_mod}]]}} @{attacher_wisdom_check}" tabindex="-1">
+      <div class="heading uppercase">
+        {{'ABILITIES.wisdom.SHORT_NAME' | translate}}
+      </div>
+    </button>
     <div class="shaped-row center">
       <div class="col-40">
         <input type="number" name="attr_wisdom" class="no-border no-spin" accept="WIS">
@@ -60,7 +81,11 @@
     </div>
   </div>
   <div class="col-15 center">
-    <div class="heading uppercase">{{'ABILITIES.charisma.SHORT_NAME' | translate}}</div>
+    <button type="roll" name="roll_charisma_check" value="@{output_option} &{template:5e-shaped} {{ability=1}} {{character_name=@{character_name}}} @{show_character_name} {{title=Charisma}} {{subheader=Ability check}} {{roll_toggle=1}} {{roll1=[[d20@{d20_mod} + @{charisma_check_mod}]]}} @{roll_setting}@{d20_mod} + @{charisma_check_mod}]]}} @{attacher_charisma_check}" tabindex="-1">
+      <div class="heading uppercase">
+        {{'ABILITIES.charisma.SHORT_NAME' | translate}}
+      </div>
+    </button>
     <div class="shaped-row center">
       <div class="col-40">
         <input type="number" name="attr_charisma" class="no-border no-spin" accept="CHA">