diff --git a/src/case/colorchooser/colorchooser.js b/src/case/colorchooser/colorchooser.js
index ff10a642a..6f28535a0 100644
--- a/src/case/colorchooser/colorchooser.js
+++ b/src/case/colorchooser/colorchooser.js
@@ -91,7 +91,7 @@ BI.ColorChooser = BI.inherit(BI.Widget, {
     },
 
     setValue: function (color) {
-        this.combo.setValue(color || "");
+        this.combo.setValue((color || "").toLowerCase());
     },
 
     getValue: function () {
diff --git a/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js b/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js
index c1eb023cc..dced6aa4a 100644
--- a/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js
+++ b/src/case/colorchooser/colorpicker/editor.colorpicker.hex.simple.js
@@ -55,66 +55,70 @@ BI.SimpleHexColorPickerEditor = BI.inherit(BI.Widget, {
             type: "bi.vertical",
             tgap: 10,
             items: [{
-                type: "bi.vertical_adapt",
-                rgap: 5,
-                items: [{
-                    el: {
-                        type: "bi.layout",
-                        cls: "color-picker-editor-display bi-card bi-border",
-                        height: 16,
+                el: {
+                    type: "bi.vertical_adapt",
+                    rgap: 5,
+                    columnSize: [16, 10, 'fill', 12, c.RGB_WIDTH, 12, c.RGB_WIDTH, 12, c.RGB_WIDTH],
+                    items: [{
+                        el: {
+                            type: "bi.layout",
+                            cls: "color-picker-editor-display bi-card bi-border",
+                            height: 16,
+                            width: 16,
+                            ref: function (_ref) {
+                                self.colorShow = _ref;
+                            }
+                        },
                         width: 16,
+                    }, {
+                        type: "bi.label",
+                        text: "#",
+                        width: 10
+                    }, {
+                        type: "bi.small_text_editor",
                         ref: function (_ref) {
-                            self.colorShow = _ref;
-                        }
-                    },
-                    width: 16,
-                }, {
-                    type: "bi.label",
-                    text: "#",
-                    width: 10
-                }, {
-                    type: "bi.small_text_editor",
-                    ref: function (_ref) {
-                        self.hexEditor = _ref;
-                    },
-                    cls: "color-picker-editor-input",
-                    validationChecker: this._hexChecker,
-                    allowBlank: true,
-                    errorText: BI.i18nText("BI-Color_Picker_Error_Text_Hex"),
-                    width: c.HEX_WIDTH,
-                    height: 20,
-                    listeners: [{
-                        eventName: "EVENT_CHANGE",
-                        action: function () {
-                            self._checkHexEditor();
-                            if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) {
-                                self.colorShow.element.css("background-color", self.getValue());
-                                self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE);
+                            self.hexEditor = _ref;
+                        },
+                        cls: "color-picker-editor-input",
+                        validationChecker: this._hexChecker,
+                        allowBlank: true,
+                        errorText: BI.i18nText("BI-Color_Picker_Error_Text_Hex"),
+                        width: c.HEX_WIDTH,
+                        height: 20,
+                        listeners: [{
+                            eventName: "EVENT_CHANGE",
+                            action: function () {
+                                self._checkHexEditor();
+                                if (checker(self.storeValue.r) && checker(self.storeValue.g) && checker(self.storeValue.b)) {
+                                    self.colorShow.element.css("background-color", self.getValue());
+                                    self.fireEvent(BI.ColorPickerEditor.EVENT_CHANGE);
+                                }
                             }
-                        }
+                        }]
+                    }, RGB[0], {
+                        el: BI.extend(Ws[0], {
+                            ref: function (_ref) {
+                                self.R = _ref
+                            }
+                        }),
+                        width: c.RGB_WIDTH
+                    }, RGB[1], {
+                        el: BI.extend(Ws[1], {
+                            ref: function (_ref) {
+                                self.G = _ref
+                            }
+                        }),
+                        width: c.RGB_WIDTH
+                    }, RGB[2], {
+                        el: BI.extend(Ws[2], {
+                            ref: function (_ref) {
+                                self.B = _ref
+                            }
+                        }),
+                        rgap: -5,
+                        width: c.RGB_WIDTH
                     }]
-                }, RGB[0], {
-                    el: BI.extend(Ws[0], {
-                        ref: function (_ref) {
-                            self.R = _ref
-                        }
-                    }),
-                    width: c.RGB_WIDTH
-                }, RGB[1], {
-                    el: BI.extend(Ws[1], {
-                        ref: function (_ref) {
-                            self.G = _ref
-                        }
-                    }),
-                    width: c.RGB_WIDTH
-                }, RGB[2], {
-                    el: BI.extend(Ws[2], {
-                        ref: function (_ref) {
-                            self.B = _ref
-                        }
-                    }),
-                    width: c.RGB_WIDTH
-                }]
+                }
             }]
 
         }