diff --git a/app/assets/images/logos/book-small-opt.png b/app/assets/images/logos/book-small-opt.png
deleted file mode 100644
index ba4434f0..00000000
Binary files a/app/assets/images/logos/book-small-opt.png and /dev/null differ
diff --git a/app/assets/images/logos/book-small.png b/app/assets/images/logos/book-small.png
index 96733bdd..ba4434f0 100644
Binary files a/app/assets/images/logos/book-small.png and b/app/assets/images/logos/book-small.png differ
diff --git a/app/assets/images/logos/book-small-opt.webp b/app/assets/images/logos/book-small.webp
similarity index 100%
rename from app/assets/images/logos/book-small-opt.webp
rename to app/assets/images/logos/book-small.webp
diff --git a/app/assets/images/logos/both-original-opt.png b/app/assets/images/logos/both-original-opt.png
deleted file mode 100644
index b034b5c9..00000000
Binary files a/app/assets/images/logos/both-original-opt.png and /dev/null differ
diff --git a/app/assets/images/logos/both-original.png b/app/assets/images/logos/both-original.png
index 3a0ea970..b034b5c9 100644
Binary files a/app/assets/images/logos/both-original.png and b/app/assets/images/logos/both-original.png differ
diff --git a/app/assets/images/logos/both-original-opt.webp b/app/assets/images/logos/both-original.webp
similarity index 100%
rename from app/assets/images/logos/both-original-opt.webp
rename to app/assets/images/logos/both-original.webp
diff --git a/app/assets/images/logos/both-small-opt.png b/app/assets/images/logos/both-small-opt.png
deleted file mode 100644
index 2b2457a3..00000000
Binary files a/app/assets/images/logos/both-small-opt.png and /dev/null differ
diff --git a/app/assets/images/logos/both-small.png b/app/assets/images/logos/both-small.png
index fe593396..2b2457a3 100644
Binary files a/app/assets/images/logos/both-small.png and b/app/assets/images/logos/both-small.png differ
diff --git a/app/assets/images/logos/both-small-opt.webp b/app/assets/images/logos/both-small.webp
similarity index 100%
rename from app/assets/images/logos/both-small-opt.webp
rename to app/assets/images/logos/both-small.webp
diff --git a/app/views/api/api_docs/docs.html.erb b/app/views/api/api_docs/docs.html.erb
index 90ec2280..9a71e352 100644
--- a/app/views/api/api_docs/docs.html.erb
+++ b/app/views/api/api_docs/docs.html.erb
@@ -1,7 +1,7 @@
 <div class="row">
   <div class="col s12 m10 offset-m1 l8 offset-l2">
     <%= link_to api_path do %>
-      <%= image_tag 'logos/both-original.png', style: 'width: 100%' %>
+      <%= image_tag 'logos/both-original.webp', style: 'width: 100%' %>
     <% end %>
   </div>
 
diff --git a/app/views/api/api_docs/index.html.erb b/app/views/api/api_docs/index.html.erb
index 7481809a..82aa0e60 100644
--- a/app/views/api/api_docs/index.html.erb
+++ b/app/views/api/api_docs/index.html.erb
@@ -1,7 +1,7 @@
 <div class="row">
   <div class="col s12 m10 offset-m1 l8 offset-l2">
     <%= link_to api_path do %>
-      <%= image_tag 'logos/both-original.png', style: 'width: 100%' %>
+      <%= image_tag 'logos/both-original.webp', style: 'width: 100%' %>
     <% end %>
   </div>
 
diff --git a/app/views/api/application_integrations/authorize.html.erb b/app/views/api/application_integrations/authorize.html.erb
index 2f520c9f..e8dfc759 100644
--- a/app/views/api/application_integrations/authorize.html.erb
+++ b/app/views/api/application_integrations/authorize.html.erb
@@ -2,7 +2,7 @@
 
 <div class="row">
   <div class="col s10 offset-s1 m6 offset-m3 l2 offset-l5 center">
-    <%= image_tag 'logos/book-small.png', width: '100%' %>
+    <%= image_tag 'logos/book-small.webp', width: '100%' %>
     <div class="blue-text uppercase">Notebook.ai</div>
     <i class="material-icons blue-text">add</i>
   </div>
diff --git a/app/views/devise/registrations/new.html.erb b/app/views/devise/registrations/new.html.erb
index d0d7d554..1ac4ca01 100644
--- a/app/views/devise/registrations/new.html.erb
+++ b/app/views/devise/registrations/new.html.erb
@@ -18,8 +18,8 @@
             Sign up for Notebook.ai
           </div>
           <div style="padding: 0 2em; padding-top: 1em">
-            <%= image_tag 'logos/both-small.png', class: 'hide-on-small-only', style: 'width: 100%' %>
-            <%= image_tag 'logos/book-small.png', class: 'hide-on-med-and-up', style: 'width: 100%' %>
+            <%= image_tag 'logos/both-small.webp', class: 'hide-on-small-only', style: 'width: 100%' %>
+            <%= image_tag 'logos/book-small.webp', class: 'hide-on-med-and-up', style: 'width: 100%' %>
           </div>
 
           <div class="field">
diff --git a/app/views/devise/sessions/new.html.erb b/app/views/devise/sessions/new.html.erb
index 79b958e9..d4b39733 100644
--- a/app/views/devise/sessions/new.html.erb
+++ b/app/views/devise/sessions/new.html.erb
@@ -2,8 +2,8 @@
   <div class="col s12 m6 offset-m3">
     <div class="card">
       <div style="padding: 0 2em; padding-top: 1em">
-        <%= image_tag 'logos/both-small.png', class: 'hide-on-small-only', style: 'width: 100%' %>
-        <%= image_tag 'logos/book-small.png', class: 'hide-on-med-and-up', style: 'width: 100%' %>
+        <%= image_tag 'logos/both-small.webp', class: 'hide-on-small-only', style: 'width: 100%' %>
+        <%= image_tag 'logos/book-small.webp', class: 'hide-on-med-and-up', style: 'width: 100%' %>
       </div>
       <div class="card-content">
         <%= render 'devise/sessions/form' %>
diff --git a/app/views/layouts/_seo.html.erb b/app/views/layouts/_seo.html.erb
index 32db9753..5e62bf9e 100644
--- a/app/views/layouts/_seo.html.erb
+++ b/app/views/layouts/_seo.html.erb
@@ -9,7 +9,7 @@
 
 display_meta_tags site: 'Notebook.ai',
                   publisher: 'https://www.facebook.com/IndentLabs',
-                  image_src: image_url('logos/both-original.png'),
+                  image_src: image_url('logos/both-original.webp'),
                   description: 'Notebook.ai is a set of tools for writers, game designers, and roleplayers to create magnificent universes — and everything within them.',
                   # Recommended keywords tag length: up to 255 characters, 20 words.
                   keywords: %w[writing author nanowrimo novel character fiction fantasy universe creative dnd roleplay larp game design worldbuilding],
diff --git a/app/views/main/for_designers.html.erb b/app/views/main/for_designers.html.erb
index d397ae4e..3c1aceb7 100644
--- a/app/views/main/for_designers.html.erb
+++ b/app/views/main/for_designers.html.erb
@@ -543,7 +543,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -557,7 +557,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -574,7 +574,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -588,7 +588,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -605,7 +605,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -621,7 +621,7 @@ body {
 
     <div class="row">
       <div class="col s12 center">
-        <div><%= image_tag 'logos/both-small.png' %></div>
+        <div><%= image_tag 'logos/both-small.webp' %></div>
         <%= link_to 'Start worldbuilding now', new_user_registration_path, class: 'btn blue btn-large waves-effect waves-light ' %>
       </div>
     </div>
diff --git a/app/views/main/for_roleplayers.html.erb b/app/views/main/for_roleplayers.html.erb
index 5d92be40..3d72e399 100644
--- a/app/views/main/for_roleplayers.html.erb
+++ b/app/views/main/for_roleplayers.html.erb
@@ -562,7 +562,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -576,7 +576,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -593,7 +593,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -607,7 +607,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -624,7 +624,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -640,7 +640,7 @@ body {
 
     <div class="row">
       <div class="col s12 center">
-        <div><%= image_tag 'logos/both-small.png' %></div>
+        <div><%= image_tag 'logos/both-small.webp' %></div>
         <%= link_to 'Start worldbuilding now', new_user_registration_path, class: 'btn blue btn-large waves-effect waves-light ' %>
       </div>
     </div>
diff --git a/app/views/main/for_writers.html.erb b/app/views/main/for_writers.html.erb
index 4f54f40e..3001761d 100644
--- a/app/views/main/for_writers.html.erb
+++ b/app/views/main/for_writers.html.erb
@@ -585,7 +585,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -599,7 +599,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -616,7 +616,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -630,7 +630,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -647,7 +647,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -661,7 +661,7 @@ body {
             <div class="card-panel grey lighten-5 z-depth-1">
               <div class="row valign-wrapper">
                 <div class="col s2">
-                  <%= image_tag 'logos/book-small.png', class: 'responsive-img' %>
+                  <%= image_tag 'logos/book-small.webp', class: 'responsive-img' %>
                 </div>
                 <div class="col s10">
                   <div class="black-text flow-text">
@@ -688,7 +688,7 @@ body {
 
     <div class="row">
       <div class="col s12 center">
-        <div><%= image_tag 'logos/both-small.png' %></div>
+        <div><%= image_tag 'logos/both-small.webp' %></div>
         <%= link_to 'Start worldbuilding now', new_user_registration_path, class: 'btn blue btn-large waves-effect waves-light ' %>
       </div>
     </div>
diff --git a/app/views/main/sascon.html.erb b/app/views/main/sascon.html.erb
index 9b12f14d..a05135e6 100644
--- a/app/views/main/sascon.html.erb
+++ b/app/views/main/sascon.html.erb
@@ -3,7 +3,7 @@
 </style>
 
 <div class="center">
-  <%= image_tag 'logos/both-small.png', class: 'center' %>
+  <%= image_tag 'logos/both-small.webp', class: 'center' %>
 </div>
 
 <h1 style="font-size: 2em">Notebook.ai + SaS Con</h1>