diff --git a/src/components/screens/Characters.vue b/src/components/screens/Characters.vue
index 48a13b7..7bab5b3 100644
--- a/src/components/screens/Characters.vue
+++ b/src/components/screens/Characters.vue
@@ -26,7 +26,7 @@
                 </button>
               </div>
             </div>
-            <div class="py-6 px-8 h-[calc(100%_-_48px)] flex flex-col items-center gap-6" v-if="selected_character">
+            <div class="py-6 px-8 h-[calc(100%_-_48px)] flex flex-col items-center gap-6 justify-center" v-if="selected_character">
               <input class="input-field w-[158px]" type="text" name="name" :placeholder="characters.find((c) => c.id == selected_character)?.name" />
               <div class="flex flex-col gap-4 items-center">
                 <div class="flex flex-col gap-3">
@@ -39,10 +39,10 @@
                       <img src="/assets/icons/triangle-icon.svg" class="w-3 h-3.5 -scale-x-100" alt="Arrow right" />
                     </button>
                   </div>
-                  <div class="flex justify-between w-[190px]">
-                    <!-- TODO: replace with color swatches -->
-                    <button v-for="n in 9" class="w-4 h-4 rounded-sm bg-white"></button>
-                  </div>
+<!--                  <div class="flex justify-between w-[190px]">-->
+<!--                    &lt;!&ndash; TODO: replace with color swatches &ndash;&gt;-->
+<!--                    <button v-for="n in 9" class="w-4 h-4 rounded-sm bg-white"></button>-->
+<!--                  </div>-->
                 </div>
                 <!-- TODO: update gender on (selected) character -->
                 <div class="flex justify-between w-[190px]">