diff --git a/backend/app/classes/SettingsManager.py b/backend/app/classes/SettingsManager.py
index a1933011b..74989873f 100644
--- a/backend/app/classes/SettingsManager.py
+++ b/backend/app/classes/SettingsManager.py
@@ -122,8 +122,8 @@ class SettingsManager(metaclass=Singleton):
         if "exposure" in dic:
             self.usb_cameras[camera_name].setExposureManual(dic["exposure"])
 
-        if "video_mode" in dic:
-            self.usb_cameras[camera_name].setVideoMode(dic["video_mode"])
+        if "resolution" in dic:
+            self.usb_cameras[camera_name].setVideoMode(self.usb_cameras[camera_name].enumerateVideoModes()[int(dic["resolution"])])
 
     # Access methods
 
@@ -133,6 +133,17 @@ class SettingsManager(metaclass=Singleton):
 
         raise NoCameraConnectedException()
 
+    def get_resolution_list(self):
+        if self.general_settings["curr_camera"]:
+            str_list = []
+            for val in self.usb_cameras[self.general_settings["curr_camera"]].enumerateVideoModes():
+                str_list.append("{width} X {height} at {fps} fps".format(width=str(val.width),
+                                                                         height=str(val.height), fps=str(val.fps)))
+
+            return str_list
+
+        raise NoCameraConnectedException()
+
     def get_curr_cam(self):
         if self.general_settings["curr_camera"]:
             return self.cams[self.general_settings["curr_camera"]]
diff --git a/backend/app/handlers/SocketHandler.py b/backend/app/handlers/SocketHandler.py
index 909878614..5db7edc60 100644
--- a/backend/app/handlers/SocketHandler.py
+++ b/backend/app/handlers/SocketHandler.py
@@ -7,7 +7,7 @@ from ..classes.SettingsManager import SettingsManager
 class ChameleonWebSocket(tornado.websocket.WebSocketHandler):
     actions = {}
 
-    set_this_camera_settings = ["exposure", "brightness", "video_mode"]
+    set_this_camera_settings = ["exposure", "brightness", "resolution"]
 
     def __init__(self, application, request, **kwargs):
         super().__init__(application, request, **kwargs)
@@ -64,6 +64,7 @@ class ChameleonWebSocket(tornado.websocket.WebSocketHandler):
         try:
             full_settings.update(self.settings_manager.get_curr_pipeline())
             full_settings["pipelineList"] = list(self.settings_manager.cams[self.settings_manager.general_settings["curr_camera"]]["pipelines"].keys())
+            full_settings["resolutionList"] = self.settings_manager.get_resolution_list()
         except NoCameraConnectedException:
             # TODO: return something if no camera connected
             full_settings["data"] = None
diff --git a/backend/settings/cams/USB Camera-B4.09.24.1.json b/backend/settings/cams/USB Camera-B4.09.24.1.json
index 2397af2ee..d9db1abbb 100644
--- a/backend/settings/cams/USB Camera-B4.09.24.1.json	
+++ b/backend/settings/cams/USB Camera-B4.09.24.1.json	
@@ -1 +1 @@
-{"pipelines": {"pipeline0": {"exposure": 34, "brightness": 11, "orientation": "Normal", "resolution": 1, "hue": [50, 58], "saturation": [65, 76], "value": [63, 79], "erode": false, "dilate": false, "area": [0, 100], "ratio": [0, 20], "extent": [0, 100], "is_binary": "Normal"}}, "path": "/dev/v4l/by-path/pci-0000:02:03.0-usb-0:1:1.0-video-index0", "video_mode": {"fps": 187, "width": 320, "height": 240, "pixel_format": "kYUYV"}}
\ No newline at end of file
+{"pipelines": {"pipeline0": {"exposure": 99, "brightness": 0, "orientation": "Inverted", "resolution": 14, "hue": [50, 58], "saturation": [65, 76], "value": [63, 79], "erode": false, "dilate": false, "area": [0, 100], "ratio": [0, 20], "extent": [0, 100], "is_binary": "Normal"}}, "path": "/dev/v4l/by-path/pci-0000:02:03.0-usb-0:1:1.0-video-index0", "video_mode": {"fps": 187, "width": 320, "height": 240, "pixel_format": "kYUYV"}}
\ No newline at end of file
diff --git a/chameleon-client/src/components/InputTab.vue b/chameleon-client/src/components/InputTab.vue
index c13b4104f..07737f056 100644
--- a/chameleon-client/src/components/InputTab.vue
+++ b/chameleon-client/src/components/InputTab.vue
@@ -4,13 +4,14 @@
         <chslider class="spacing" title="exposure" Xkey="exposure"></chslider>
         <chslider class="spacing" title="Brightness" Xkey="brightness"></chslider>
         <chselect class="spacing" title="Orientation" Xkey="orientation" :list="['Normal','Inverted']"></chselect>
-        <chselect class="spacing" title="Resolution" Xkey="resolution"  :list="resolutionList"></chselect>
+        <ch-index-select class="spacing" title="Resolution" Xkey="resolution"  :list="resolutionList"></ch-index-select>
         </div>
 </template>
     
 <script> 
 import chslider from './ch-slider.vue'
 import chselect from './ch-select.vue'
+import chIndexSelect from './ch-IndexSelect.vue'
     export default {
         name: 'InputTab',
         data () {
@@ -19,14 +20,15 @@ import chselect from './ch-select.vue'
         },
         components: {
             chslider,
-            chselect
+            chselect,
+            chIndexSelect
         },
         methods: {
         },
         computed:{
             resolutionList:{
                 get:function(){
-                    return this.$store.state.resolution;
+                    return this.$store.state.resolutionList;
                 }
             }
         }
diff --git a/chameleon-client/src/components/Vision.vue b/chameleon-client/src/components/Vision.vue
index 3963a1582..0b6a63446 100644
--- a/chameleon-client/src/components/Vision.vue
+++ b/chameleon-client/src/components/Vision.vue
@@ -20,7 +20,7 @@
                     <TabPane label="Normal"></TabPane>    
                     <TabPane label="Threshold"></TabPane>
                     </Tabs>
-                    <img :src="steamAdress" style="">
+                    <img class="imageSize" :src="steamAdress" style="">
                     </Col>
                 </Col>
             </row>
@@ -77,4 +77,8 @@
 .ivu-tabs-nav .ivu-tabs-tab:hover{
     color: #0cdfc3 !important;
 }
+.imageSize{
+    width: 75%;
+    height: 75%;
+}
 </style>
\ No newline at end of file
diff --git a/chameleon-client/src/components/ch-IndexSelect.vue b/chameleon-client/src/components/ch-IndexSelect.vue
new file mode 100644
index 000000000..044d3819b
--- /dev/null
+++ b/chameleon-client/src/components/ch-IndexSelect.vue
@@ -0,0 +1,57 @@
+<template>
+    <Row type="flex" justify="start" align="middle" :gutter="1" >
+        <Col span="4">
+            <h4>{{title.charAt(0).toUpperCase() + title.slice(1)}} :</h4>
+        </Col>
+        <Col span="4">
+            <i-select v-model="value" size="small" @on-change="handleInput">
+                <i-option v-for="(item,index) in list" :value="index" :key="index">{{item}}</i-option>
+            </i-select>
+        </Col>
+    </Row>
+</template>
+
+<script>
+    export default {
+        name: 'ch-select',
+        props:{
+            title: String,
+            list: Array,
+            Xkey: String
+        },
+        data() {
+            return {
+            
+            }
+        },
+        methods: {
+            handleInput() {
+                this.$socket.sendObj({[this.Xkey]:this.value});
+            }
+        },
+        computed:{
+            value:{
+                get: function(){
+                    return this.$store.state[this.Xkey];
+                },
+                set: function(value){
+                    this.$store.commit(this.Xkey,value);
+                }
+            }
+        }
+    }
+</script>
+
+<style>
+h4 {
+     color: #e6ebf1;
+      text-align: left;
+ }
+ /* .ivu-select-selection{
+     background-color: #2c3e50 !important;
+ } */
+ /* .ivu-select-selected-value{
+     color: #fff !important;
+ } */
+
+</style>
\ No newline at end of file
diff --git a/chameleon-client/src/store.js b/chameleon-client/src/store.js
index 03647c86d..19856c3df 100644
--- a/chameleon-client/src/store.js
+++ b/chameleon-client/src/store.js
@@ -17,7 +17,8 @@ export const store = new Vuex.Store({
         exposure:54,
         brightness:0,
         orientation:0,
-        resolution:[],
+        resolution:0,
+        resolutionList:[],
         //threshold
         hue:[0,10],
         saturation:[0,10],