diff --git a/src/components/Picker.vue b/src/components/Picker.vue
new file mode 100644
index 0000000..4c011c1
--- /dev/null
+++ b/src/components/Picker.vue
@@ -0,0 +1,40 @@
+<template>
+  <div>
+    <!-- <a href="" uk-marker>
+        <input v-model="primary" type="color" name="" id="">
+    </a>
+    <a href="" uk-marker>
+        <input v-model="secondary"  type="color" name="" id="">
+    </a> -->
+   <label for="primary">Primary Color: </label>
+        <input v-model="primary" type="color"  name="primary" id="primary">
+   <br/>
+   <label for="secondary">Secondary Color: </label>
+        <input v-model="secondary"  type="color" name="secondary" id="secondary">
+    
+  </div>
+</template>
+
+<script>
+import {dispatch} from 'vuex'
+export default {
+    data(){
+        return {
+            primary: '#55828b',
+            secondary: '#fed18c'
+        }
+    },
+    methods: {
+        updatePrimary(){
+            dispatch('primary', this.primary) 
+        },
+        updateSecondary(){
+            dispatch('secondary', this.secondary) 
+        }
+    }
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file