diff --git a/resources/www/common/images/Thumbs.db b/resources/www/common/images/Thumbs.db
new file mode 100644
index 0000000000..d396c36dd8
Binary files /dev/null and b/resources/www/common/images/Thumbs.db differ
diff --git a/resources/www/common/images/blank.gif b/resources/www/common/images/blank.gif
new file mode 100644
index 0000000000..75b945d255
Binary files /dev/null and b/resources/www/common/images/blank.gif differ
diff --git a/resources/www/common/images/colorpicker_background.png b/resources/www/common/images/colorpicker_background.png
new file mode 100644
index 0000000000..7e916d5d1f
Binary files /dev/null and b/resources/www/common/images/colorpicker_background.png differ
diff --git a/resources/www/common/images/colorpicker_hex.png b/resources/www/common/images/colorpicker_hex.png
new file mode 100644
index 0000000000..4e532d7c65
Binary files /dev/null and b/resources/www/common/images/colorpicker_hex.png differ
diff --git a/resources/www/common/images/colorpicker_hsb_b.png b/resources/www/common/images/colorpicker_hsb_b.png
new file mode 100644
index 0000000000..dfac595d01
Binary files /dev/null and b/resources/www/common/images/colorpicker_hsb_b.png differ
diff --git a/resources/www/common/images/colorpicker_hsb_h.png b/resources/www/common/images/colorpicker_hsb_h.png
new file mode 100644
index 0000000000..3977ed9f21
Binary files /dev/null and b/resources/www/common/images/colorpicker_hsb_h.png differ
diff --git a/resources/www/common/images/colorpicker_hsb_s.png b/resources/www/common/images/colorpicker_hsb_s.png
new file mode 100644
index 0000000000..a2a699736c
Binary files /dev/null and b/resources/www/common/images/colorpicker_hsb_s.png differ
diff --git a/resources/www/common/images/colorpicker_indic.gif b/resources/www/common/images/colorpicker_indic.gif
new file mode 100644
index 0000000000..f9fa95e282
Binary files /dev/null and b/resources/www/common/images/colorpicker_indic.gif differ
diff --git a/resources/www/common/images/colorpicker_overlay.png b/resources/www/common/images/colorpicker_overlay.png
new file mode 100644
index 0000000000..561cdd9c59
Binary files /dev/null and b/resources/www/common/images/colorpicker_overlay.png differ
diff --git a/resources/www/common/images/colorpicker_rgb_b.png b/resources/www/common/images/colorpicker_rgb_b.png
new file mode 100644
index 0000000000..dfac595d01
Binary files /dev/null and b/resources/www/common/images/colorpicker_rgb_b.png differ
diff --git a/resources/www/common/images/colorpicker_rgb_g.png b/resources/www/common/images/colorpicker_rgb_g.png
new file mode 100644
index 0000000000..72b32760a5
Binary files /dev/null and b/resources/www/common/images/colorpicker_rgb_g.png differ
diff --git a/resources/www/common/images/colorpicker_rgb_r.png b/resources/www/common/images/colorpicker_rgb_r.png
new file mode 100644
index 0000000000..4855fe03f8
Binary files /dev/null and b/resources/www/common/images/colorpicker_rgb_r.png differ
diff --git a/resources/www/common/images/colorpicker_select.gif b/resources/www/common/images/colorpicker_select.gif
new file mode 100644
index 0000000000..599f7f13a6
Binary files /dev/null and b/resources/www/common/images/colorpicker_select.gif differ
diff --git a/resources/www/common/images/colorpicker_submit.png b/resources/www/common/images/colorpicker_submit.png
new file mode 100644
index 0000000000..7f4c0825f5
Binary files /dev/null and b/resources/www/common/images/colorpicker_submit.png differ
diff --git a/resources/www/common/images/custom_background.png b/resources/www/common/images/custom_background.png
new file mode 100644
index 0000000000..cf55ffdd68
Binary files /dev/null and b/resources/www/common/images/custom_background.png differ
diff --git a/resources/www/common/images/custom_hex.png b/resources/www/common/images/custom_hex.png
new file mode 100644
index 0000000000..888f444495
Binary files /dev/null and b/resources/www/common/images/custom_hex.png differ
diff --git a/resources/www/common/images/custom_hsb_b.png b/resources/www/common/images/custom_hsb_b.png
new file mode 100644
index 0000000000..2f99dae8e6
Binary files /dev/null and b/resources/www/common/images/custom_hsb_b.png differ
diff --git a/resources/www/common/images/custom_hsb_h.png b/resources/www/common/images/custom_hsb_h.png
new file mode 100644
index 0000000000..a217e9218e
Binary files /dev/null and b/resources/www/common/images/custom_hsb_h.png differ
diff --git a/resources/www/common/images/custom_hsb_s.png b/resources/www/common/images/custom_hsb_s.png
new file mode 100644
index 0000000000..7826b41507
Binary files /dev/null and b/resources/www/common/images/custom_hsb_s.png differ
diff --git a/resources/www/common/images/custom_indic.gif b/resources/www/common/images/custom_indic.gif
new file mode 100644
index 0000000000..222fb94cfd
Binary files /dev/null and b/resources/www/common/images/custom_indic.gif differ
diff --git a/resources/www/common/images/custom_rgb_b.png b/resources/www/common/images/custom_rgb_b.png
new file mode 100644
index 0000000000..80764e5d6d
Binary files /dev/null and b/resources/www/common/images/custom_rgb_b.png differ
diff --git a/resources/www/common/images/custom_rgb_g.png b/resources/www/common/images/custom_rgb_g.png
new file mode 100644
index 0000000000..fc9778be1e
Binary files /dev/null and b/resources/www/common/images/custom_rgb_g.png differ
diff --git a/resources/www/common/images/custom_rgb_r.png b/resources/www/common/images/custom_rgb_r.png
new file mode 100644
index 0000000000..91b0cd4c52
Binary files /dev/null and b/resources/www/common/images/custom_rgb_r.png differ
diff --git a/resources/www/common/images/custom_submit.png b/resources/www/common/images/custom_submit.png
new file mode 100644
index 0000000000..cd202cd93b
Binary files /dev/null and b/resources/www/common/images/custom_submit.png differ
diff --git a/resources/www/common/images/select.png b/resources/www/common/images/select.png
new file mode 100644
index 0000000000..21213bfd51
Binary files /dev/null and b/resources/www/common/images/select.png differ
diff --git a/resources/www/common/images/select2.png b/resources/www/common/images/select2.png
new file mode 100644
index 0000000000..2cd2cabeb6
Binary files /dev/null and b/resources/www/common/images/select2.png differ
diff --git a/resources/www/common/images/slider.png b/resources/www/common/images/slider.png
new file mode 100644
index 0000000000..8b03da96eb
Binary files /dev/null and b/resources/www/common/images/slider.png differ
diff --git a/resources/www/common/styles/colorpicker.scss b/resources/www/common/styles/colorpicker.scss
new file mode 100644
index 0000000000..f20ee54a28
--- /dev/null
+++ b/resources/www/common/styles/colorpicker.scss
@@ -0,0 +1,167 @@
+$colorPickerImagesPath: '/assets/common/images/' !default;
+
+.colorpicker {
+  width: 356px;
+  height: 176px;
+  overflow: hidden;
+  position: absolute;
+  background: url('#{$colorPickerImagesPath}colorpicker_background.png');
+  font-family: Arial, Helvetica, sans-serif;
+  display: none;
+}
+.colorpicker_color {
+  width: 150px;
+  height: 150px;
+  left: 14px;
+  top: 13px;
+  position: absolute;
+  background: #f00;
+  overflow: hidden;
+  cursor: crosshair;
+}
+.colorpicker_color div {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 150px;
+  height: 150px;
+  background: url('#{$colorPickerImagesPath}colorpicker_overlay.png');
+}
+.colorpicker_color div div {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 11px;
+  height: 11px;
+  overflow: hidden;
+  background: url('#{$colorPickerImagesPath}colorpicker_select.gif');
+  margin: -5px 0 0 -5px;
+}
+.colorpicker_hue {
+  position: absolute;
+  top: 13px;
+  left: 171px;
+  width: 35px;
+  height: 150px;
+  cursor: n-resize;
+}
+.colorpicker_hue div {
+  position: absolute;
+  width: 35px;
+  height: 9px;
+  overflow: hidden;
+  background: url('#{$colorPickerImagesPath}colorpicker_indic.gif') left top;
+  margin: -4px 0 0 0;
+  left: 0px;
+}
+.colorpicker_new_color {
+  position: absolute;
+  width: 60px;
+  height: 30px;
+  left: 213px;
+  top: 13px;
+  background: #f00;
+}
+.colorpicker_current_color {
+  position: absolute;
+  width: 60px;
+  height: 30px;
+  left: 283px;
+  top: 13px;
+  background: #f00;
+}
+.colorpicker input {
+  background-color: transparent;
+  border: 1px solid transparent;
+  position: absolute;
+  font-size: 10px;
+  font-family: Arial, Helvetica, sans-serif;
+  color: #898989;
+  top: 4px;
+  right: 11px;
+  text-align: right;
+  margin: 0;
+  padding: 0;
+  height: 11px;
+}
+.colorpicker_hex {
+  position: absolute;
+  width: 72px;
+  height: 22px;
+  background: url('#{$colorPickerImagesPath}colorpicker_hex.png') top;
+  left: 212px;
+  top: 142px;
+}
+.colorpicker_hex input {
+  right: 6px;
+}
+.colorpicker_field {
+  height: 22px;
+  width: 62px;
+  background-position: top;
+  position: absolute;
+}
+.colorpicker_field span {
+  position: absolute;
+  width: 12px;
+  height: 22px;
+  overflow: hidden;
+  top: 0;
+  right: 0;
+  cursor: n-resize;
+}
+.colorpicker_rgb_r {
+  background-image: url('#{$colorPickerImagesPath}colorpicker_rgb_r.png');
+  top: 52px;
+  left: 212px;
+}
+.colorpicker_rgb_g {
+  background-image: url('#{$colorPickerImagesPath}colorpicker_rgb_g.png');
+  top: 82px;
+  left: 212px;
+}
+.colorpicker_rgb_b {
+  background-image: url('#{$colorPickerImagesPath}colorpicker_rgb_b.png');
+  top: 112px;
+  left: 212px;
+}
+.colorpicker_hsb_h {
+  background-image: url('#{$colorPickerImagesPath}colorpicker_hsb_h.png');
+  top: 52px;
+  left: 282px;
+}
+.colorpicker_hsb_s {
+  background-image: url('#{$colorPickerImagesPath}colorpicker_hsb_s.png');
+  top: 82px;
+  left: 282px;
+}
+.colorpicker_hsb_b {
+  background-image: url('#{$colorPickerImagesPath}colorpicker_hsb_b.png');
+  top: 112px;
+  left: 282px;
+}
+.colorpicker_submit {
+  position: absolute;
+  width: 22px;
+  height: 22px;
+  background: url('#{$colorPickerImagesPath}colorpicker_submit.png') top;
+  left: 322px;
+  top: 142px;
+  overflow: hidden;
+  .submiter {
+    color: #ffffff;
+  }
+}
+.colorpicker_focus {
+  background-position: center;
+}
+.colorpicker_hex.colorpicker_focus {
+  background-position: bottom;
+}
+.colorpicker_submit.colorpicker_focus {
+  background-position: bottom;
+}
+.colorpicker_slider {
+  background-position: bottom;
+}
+
diff --git a/resources/www/common/styles/main.scss b/resources/www/common/styles/main.scss
index 2db11935b6..d177262100 100644
--- a/resources/www/common/styles/main.scss
+++ b/resources/www/common/styles/main.scss
@@ -14,6 +14,7 @@
 @import '../../../../node_modules/font-awesome/scss/font-awesome.scss';
 @import './fonts/PhraseanetIcomoon/style';
 @import './roboto.scss';
+@import './colorpicker.scss';
 @import '../../_shared/styles/variables';
 @import '../../vendors/bootstrap/bootstrap';
 @import '../../vendors/bootstrap/responsive';
@@ -83,3 +84,4 @@ $mainMenuLinkBackgroundHoverColor: transparent;
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.39);
   }
 }
+