diff --git a/website/assets/styles/pages/query-library.less b/website/assets/styles/pages/query-library.less
index a6d883789e..6584078dd2 100644
--- a/website/assets/styles/pages/query-library.less
+++ b/website/assets/styles/pages/query-library.less
@@ -67,6 +67,7 @@
     padding: 2px 8px;
     border-radius: 20px;
     background-color: #E2E4EA;
+    color: #515774;
   }
 
   [purpose='selected-tag'] {
@@ -199,6 +200,7 @@
   .description {
     padding: 0px 30px 0px 30px;
     p {
+      color: #515774;
       font-size: 16px;
       line-height: 25px;
     }
@@ -263,6 +265,7 @@
     box-shadow: none;
     border: none;
     border-radius: 8px;
+    color: #515774;
     &:hover {
       .query-card {
         background-color: #F8F7FF;
@@ -271,6 +274,7 @@
         border-radius: 8px;
         cursor: pointer;
       }
+      text-decoration: none;
     }
   }
 
diff --git a/website/views/pages/query-library.ejs b/website/views/pages/query-library.ejs
index 59172d0798..14f54ec040 100644
--- a/website/views/pages/query-library.ejs
+++ b/website/views/pages/query-library.ejs
@@ -98,15 +98,15 @@
         </div>
         <div class="category__informational">
           <div v-for="query of queriesList">
-            <div class="card results" @click="clickCard(query.slug)">
+            <a class="card results" :href="'/queries/'+query.slug">
               <div class="card-body">
                 <div class="row justify-content-between align-items-center query-card">
                   <div class="col-12">
                     <div class="d-flex flex-row align-items-center flex-wrap">
                       <h5 class="card-title m-0 mb-1 mr-2">{{query.name}}</h5>
-                      <a purpose="critical-badge" class="mr-2" v-if="query.critical">Critical</a>
-                      <a purpose="requires-mdm-badge" class="mr-2" v-if="query.requiresMdm">Requires MDM</a>
-                      <span class="mr-2 my-sm-0 my-1 text-nowrap d-inline-flex" purpose="query-tag" v-for="tag in query.tags" @click.stop="clickSelectTag(tag)">{{tag}}</span>
+                      <span purpose="critical-badge" class="mr-2" v-if="query.critical">Critical</span>
+                      <span purpose="requires-mdm-badge" class="mr-2" v-if="query.requiresMdm">Requires MDM</span>
+                      <span class="mr-2 my-sm-0 my-1 text-nowrap d-inline-flex" purpose="query-tag" v-for="tag in query.tags" @click.stop.prevent="clickSelectTag(tag)">{{tag}}</span>
                     </div>
                   </div>
                   <div class="col-sm-9 col-md-9">
@@ -141,7 +141,8 @@
                 </div>
               </div>
               <div class="divider"></div>
-            </div>
+
+            </a>
           </div>
           <div purpose="query-list-empty-state" v-if="queriesList.length === 0">
             <p class="mb-0">There are no results that match your filters. <a target="_blank" href="https://github.com/fleetdm/fleet/edit/main/docs/01-Using-Fleet/standard-query-library/standard-query-library.yml">Everyone can contribute</a>.</p>