diff --git a/src/assets/main.scss b/src/assets/main.scss
index f4260d9..47d2a64 100644
--- a/src/assets/main.scss
+++ b/src/assets/main.scss
@@ -96,3 +96,18 @@ form .error {
   margin: 25px 0 0 0;
 }
 
+select.form-control:not([multiple]) {
+  cursor: pointer;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAI9JREFUeNpiZACCyMjIBCDVD8SOy5cvv8BAAgDqNQBS+4G4EKh3ASPUsPlQ+Q+kGIpkmABUKJEJ6jIYAEnshyok1TAQ6AcZ6Ah1GdGG4jAM7DtGQgrQvU9ILSOxColVw0is7VA2QV8wkhA+DMQECSMJgc5AyDCcBhIwFG9aZSQxrRFM+IwkJGAGYnIRQIABACQuXCKovu2mAAAAAElFTkSuQmCC);
+  background-size: 1rem;
+  background-repeat: no-repeat;
+  background-position: calc(100% - 1rem) center;
+  padding: .5em 3em .5em 1em;
+  background-color: var(--color-background);
+  color: var(--color-text);
+  border: 1px solid var(--color-border);
+  border-radius: .4rem;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
\ No newline at end of file
diff --git a/src/components/TodoRoot.vue b/src/components/TodoRoot.vue
index 33d3e8b..5e8d33e 100644
--- a/src/components/TodoRoot.vue
+++ b/src/components/TodoRoot.vue
@@ -18,9 +18,9 @@
         Show completed
       </label>
 
-      <div class="form-control">
+      <div>
         <label for="list-selector">List: </label>
-        <select id="list-selector" v-model="currentList">
+        <select id="list-selector" class="form-control" v-model="currentList">
           <option :value="0">All</option>
           <option v-for="item in lists" :key="item.id" :value="item.id">{{ item.title }}</option>
         </select>
@@ -337,5 +337,6 @@ h1 {
 #filter-form {
   display: flex;
   justify-content: space-between;
+  align-items: center;
 }
 </style>
\ No newline at end of file