diff --git a/client/src/views/Summoner.vue b/client/src/views/Summoner.vue
index bdc20bc..f84036b 100644
--- a/client/src/views/Summoner.vue
+++ b/client/src/views/Summoner.vue
@@ -23,7 +23,7 @@
   </div>
   <div v-else class="mt-3 flex text-center">
     <div class="mt-4 w-3/12">
-      <div class="bg-blue-800 rounded-lg" style="width: 300px; height: 339px;">
+      <div class="bg-blue-850 rounded-lg" style="width: 300px; height: 339px;">
         <content-loader
           :height="339"
           :width="300"
@@ -63,7 +63,7 @@
           <rect x="246" y="308" rx="3" ry="3" width="42" height="16" />
         </content-loader>
       </div>
-      <div class="mt-4 bg-blue-800 rounded-lg" style="width: 300px; height: 828px;">
+      <div class="mt-4 bg-blue-850 rounded-lg" style="width: 300px; height: 828px;">
         <content-loader
           :height="828"
           :width="300"
@@ -155,7 +155,7 @@
         </content-loader>
       </div>
 
-      <div class="mt-4 bg-blue-800 rounded-lg" style="width: 300px; height: 384px;">
+      <div class="mt-4 bg-blue-850 rounded-lg" style="width: 300px; height: 384px;">
         <content-loader
           :height="384"
           :width="300"
@@ -213,7 +213,7 @@
       <div
         v-for="index in 10"
         :key="index"
-        class="mt-4 ml-4 bg-blue-800 rounded-lg"
+        class="mt-4 ml-4 bg-blue-850 rounded-lg"
         style="width: 884px; height: 144px;"
       >
         <content-loader
diff --git a/client/tailwind.config.js b/client/tailwind.config.js
index a431761..f70218d 100644
--- a/client/tailwind.config.js
+++ b/client/tailwind.config.js
@@ -92,6 +92,7 @@ module.exports = {
         700: '#2b6cb0',
         760: '#2C5C94',
         800: '#2c5282',
+        850: '#2B4B74',
         900: '#2a4365',
         1000: '#17314f'
       },