diff --git a/assets/main.scss b/assets/main.scss
index 5a2d2cb..e637433 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -362,9 +362,14 @@ button {
     &-input {
         @apply flex items-center justify-between;
 
-        span {
-            @apply select-none w-full h-full;
+        >div {
+            @apply h-10 overflow-hidden rounded border-gray-300 shadow inline-block leading-none grow;
+
+            span {
+                @apply flex select-none w-full h-full justify-center items-center;
+            }
         }
+
     }
 
     &-button {
diff --git a/components/dropdown/color.vue b/components/dropdown/color.vue
index efc7ccb..1055670 100644
--- a/components/dropdown/color.vue
+++ b/components/dropdown/color.vue
@@ -1,12 +1,12 @@
 <script setup lang="ts">
 import { ralClassicPallette } from '@/components/ral'
 
-const props = defineProps(['color', 'cb'])
+const props = defineProps([ 'cb'])
 
 </script>
 <template>
     <template v-for="col in ralClassicPallette">
-        <div class="picker-item" :class="[{ 'outline outline-primary': props.color == col.hex }]"
+        <div class="picker-item" 
             :style="[{ backgroundColor: col.hex }]" @click="props.cb(col.code)">
         </div>
     </template>
diff --git a/components/dropdown/list.vue b/components/dropdown/list.vue
index 9f9be37..bbbc43f 100644
--- a/components/dropdown/list.vue
+++ b/components/dropdown/list.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { getFilename, patterns } from '../pattern';
 
-const props = defineProps(['color', 'cb']);
+const props = defineProps([ 'cb']);
 </script>
 <template>
     <template v-for="item in patterns">
diff --git a/components/dropdown/picker.vue b/components/dropdown/picker.vue
index d075fe3..66daa79 100644
--- a/components/dropdown/picker.vue
+++ b/components/dropdown/picker.vue
@@ -1,7 +1,5 @@
 <script setup lang="ts">
-import { getColorHexFromRal } from '@/components/ral'
-
-const props = defineProps(['color', 'cb', 'name', 'type', 'disabled', 'goto_cam', 'goto_target'])
+const props = defineProps(['cb', 'name', 'type', 'disabled', 'goto_cam', 'goto_target'])
 
 const goto_cam = use_goto_camera()
 const goto_target = use_goto_target()
@@ -39,20 +37,19 @@ watch(open_calc, () => {
         'picker_disabled': props.disabled,
     }]" ref="picker">
         <div class="picker-input">
-            <template>
-                <slot class="picker-selected" @click="toggleOpen(!is_open)"
-                    :style="[props.color && { backgroundColor: props.color ?? '' }]"></slot>
-            </template>
+            <div @click="toggleOpen(!is_open)">
+                <slot></slot>
+            </div>
             <Icon class="picker-button" :name="is_open ? 'mdi:chevron-down' : 'mdi:chevron-up'"
                 @click="toggleOpen(!is_open)" />
         </div>
 
         <div class="picker-changer flex flex-wrap" v-if="is_open">
             <template v-if="props.type == 'color'">
-                <DropdownColor :color="props.color" :cb="onClick" />
+                <DropdownColor :cb="onClick" />
             </template>
             <template v-else-if="props.type == 'pattern'">
-                <DropdownList :color="props.color" :cb="onClick" />
+                <DropdownList :cb="onClick" />
             </template>
         </div>
     </div>