diff --git a/package.json b/package.json
index 936c94c2..9727da5e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "coryd.dev",
-  "version": "12.7.2",
+  "version": "12.7.3",
   "description": "The source for my personal site. Built using 11ty.",
   "type": "module",
   "scripts": {
diff --git a/src/assets/styles/pages/books.css b/src/assets/styles/pages/books.css
index 593254b3..d0a5cf94 100644
--- a/src/assets/styles/pages/books.css
+++ b/src/assets/styles/pages/books.css
@@ -11,6 +11,15 @@
   & img {
     border: 1px solid var(--accent-color);
     border-radius: var(--rounded);
+    transition-property: border-color;
+    transition-timing-function: var(--transition-ease-in-out);
+    transition-duration: 300ms;
+  }
+
+  & a:hover img,
+  & a:focus img,
+  & a:active img {
+    border-color: var(--accent-color-hover)
   }
 
   & img,
diff --git a/src/pages/books/index.html b/src/pages/books/index.html
index 5cd3c781..aa0adb2e 100644
--- a/src/pages/books/index.html
+++ b/src/pages/books/index.html
@@ -10,7 +10,9 @@ permalink: "/books/index.html"
 {% for book in bookData %}
 {% capture alt %}{{ book.title }} by {{ book.authors }}{% endcapture %}
 <article class="book-entry">
-  {% image book.image, alt %}
+  <a href="{{ book.url }}">
+    {% image book.image, alt %}
+  </a>
   <div class="book-meta">
     <a href="{{ book.url }}">
       <p class="title"><strong>{{ book.title }}</strong></p>