diff --git a/gui/include/Visualization/ColorScaleEditor.h b/gui/include/Visualization/ColorScaleEditor.h
new file mode 100644
index 0000000..a0d2c7a
--- /dev/null
+++ b/gui/include/Visualization/ColorScaleEditor.h
@@ -0,0 +1,24 @@
+#ifndef SCIQLOP_COLORSCALEEDITOR_H
+#define SCIQLOP_COLORSCALEEDITOR_H
+
+#include <QDialog>
+
+namespace Ui {
+class ColorScaleEditor;
+} // Ui
+
+/**
+ * @brief The ColorScaleEditor class represents the widget to set properties of color scale's graphs
+ */
+class ColorScaleEditor : public QDialog {
+    Q_OBJECT
+
+public:
+    explicit ColorScaleEditor(QWidget *parent = 0);
+    virtual ~ColorScaleEditor() noexcept;
+
+private:
+    Ui::ColorScaleEditor *ui;
+};
+
+#endif // SCIQLOP_COLORSCALEEDITOR_H
diff --git a/gui/meson.build b/gui/meson.build
index 7748236..4106eb8 100644
--- a/gui/meson.build
+++ b/gui/meson.build
@@ -16,7 +16,8 @@ gui_moc_headers = [
   'include/Visualization/VisualizationWidget.h',
   'include/Visualization/VisualizationZoneWidget.h',
   'include/Visualization/VisualizationDragDropContainer.h',
-  'include/Visualization/VisualizationDragWidget.h'
+  'include/Visualization/VisualizationDragWidget.h',
+  'include/Visualization/ColorScaleWidget.h'
 ]
 
 gui_ui_files = [
@@ -31,7 +32,8 @@ gui_ui_files = [
   'ui/Visualization/VisualizationGraphWidget.ui',
   'ui/Visualization/VisualizationTabWidget.ui',
   'ui/Visualization/VisualizationWidget.ui',
-  'ui/Visualization/VisualizationZoneWidget.ui'
+  'ui/Visualization/VisualizationZoneWidget.ui',
+  'ui/Visualization/ColorScaleWidget.ui'
 ]
 
 gui_qresources = ['resources/sqpguiresources.qrc']
@@ -77,7 +79,8 @@ gui_sources = [
   'src/Visualization/AxisRenderingUtils.cpp',
   'src/Visualization/PlottablesRenderingUtils.cpp',
   'src/Visualization/MacScrollBarStyle.cpp',
-  'src/Visualization/VisualizationCursorItem.cpp'
+  'src/Visualization/VisualizationCursorItem.cpp',
+  'src/Visualization/ColorScaleWidget.cpp'
 ]
 
 gui_inc = include_directories(['include'])
diff --git a/gui/src/Visualization/ColorScaleEditor.cpp b/gui/src/Visualization/ColorScaleEditor.cpp
new file mode 100644
index 0000000..8009d36
--- /dev/null
+++ b/gui/src/Visualization/ColorScaleEditor.cpp
@@ -0,0 +1,13 @@
+#include "Visualization/ColorScaleEditor.h"
+
+#include "ui_ColorScaleEditor.h"
+
+ColorScaleEditor::ColorScaleEditor(QWidget *parent) : QDialog{parent}, ui{new Ui::ColorScaleEditor}
+{
+    ui->setupUi(this);
+}
+
+ColorScaleEditor::~ColorScaleEditor() noexcept
+{
+    delete ui;
+}
diff --git a/gui/ui/Visualization/ColorScaleEditor.ui b/gui/ui/Visualization/ColorScaleEditor.ui
new file mode 100644
index 0000000..bdd36e0
--- /dev/null
+++ b/gui/ui/Visualization/ColorScaleEditor.ui
@@ -0,0 +1,169 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<ui version="4.0">
+ <class>ColorScaleEditor</class>
+ <widget class="QDialog" name="ColorScaleEditor">
+  <property name="geometry">
+   <rect>
+    <x>0</x>
+    <y>0</y>
+    <width>258</width>
+    <height>232</height>
+   </rect>
+  </property>
+  <property name="windowTitle">
+   <string>Color scale editor</string>
+  </property>
+  <layout class="QGridLayout" name="gridLayout">
+   <item row="3" column="0">
+    <layout class="QHBoxLayout" name="horizontalLayout">
+     <item>
+      <spacer name="horizontalSpacer">
+       <property name="orientation">
+        <enum>Qt::Horizontal</enum>
+       </property>
+       <property name="sizeHint" stdset="0">
+        <size>
+         <width>40</width>
+         <height>20</height>
+        </size>
+       </property>
+      </spacer>
+     </item>
+     <item>
+      <widget class="QPushButton" name="okButton">
+       <property name="text">
+        <string>OK</string>
+       </property>
+       <property name="default">
+        <bool>true</bool>
+       </property>
+      </widget>
+     </item>
+     <item>
+      <widget class="QPushButton" name="cancelButton">
+       <property name="text">
+        <string>Cancel</string>
+       </property>
+      </widget>
+     </item>
+    </layout>
+   </item>
+   <item row="1" column="0">
+    <widget class="QGroupBox" name="groupBox">
+     <property name="title">
+      <string>Preview</string>
+     </property>
+     <layout class="QGridLayout" name="gridLayout_3">
+      <item row="0" column="0">
+       <widget class="QCustomPlot" name="plot" native="true"/>
+      </item>
+     </layout>
+    </widget>
+   </item>
+   <item row="0" column="0">
+    <layout class="QGridLayout" name="gridLayout_2">
+     <item row="1" column="0">
+      <widget class="QLabel" name="thresholdLabel">
+       <property name="text">
+        <string>Thresholds:</string>
+       </property>
+      </widget>
+     </item>
+     <item row="1" column="1">
+      <widget class="QRadioButton" name="thresholdAutoButton">
+       <property name="enabled">
+        <bool>false</bool>
+       </property>
+       <property name="text">
+        <string>Automatic</string>
+       </property>
+       <property name="checkable">
+        <bool>true</bool>
+       </property>
+       <property name="checked">
+        <bool>false</bool>
+       </property>
+      </widget>
+     </item>
+     <item row="1" column="2">
+      <widget class="QRadioButton" name="thresholdManualButton">
+       <property name="text">
+        <string>Manual</string>
+       </property>
+      </widget>
+     </item>
+     <item row="2" column="0">
+      <widget class="QLabel" name="minLabel">
+       <property name="text">
+        <string>Min:</string>
+       </property>
+      </widget>
+     </item>
+     <item row="3" column="0">
+      <widget class="QLabel" name="maxLabel">
+       <property name="text">
+        <string>Max:</string>
+       </property>
+      </widget>
+     </item>
+     <item row="2" column="1" colspan="2">
+      <widget class="QDoubleSpinBox" name="minSpinBox">
+       <property name="showGroupSeparator" stdset="0">
+        <bool>true</bool>
+       </property>
+      </widget>
+     </item>
+     <item row="3" column="1" colspan="2">
+      <widget class="QDoubleSpinBox" name="maxSpinBox">
+       <property name="showGroupSeparator" stdset="0">
+        <bool>true</bool>
+       </property>
+      </widget>
+     </item>
+     <item row="0" column="0">
+      <widget class="QLabel" name="gradientLabel">
+       <property name="text">
+        <string>Gradient:</string>
+       </property>
+      </widget>
+     </item>
+     <item row="0" column="1" colspan="2">
+      <widget class="QComboBox" name="gradientComboBox"/>
+     </item>
+    </layout>
+   </item>
+   <item row="2" column="0">
+    <spacer name="verticalSpacer">
+     <property name="orientation">
+      <enum>Qt::Vertical</enum>
+     </property>
+     <property name="sizeHint" stdset="0">
+      <size>
+       <width>20</width>
+       <height>40</height>
+      </size>
+     </property>
+    </spacer>
+   </item>
+  </layout>
+ </widget>
+ <customwidgets>
+  <customwidget>
+   <class>QCustomPlot</class>
+   <extends>QWidget</extends>
+   <header>Visualization/qcustomplot.h</header>
+   <container>1</container>
+  </customwidget>
+ </customwidgets>
+ <tabstops>
+  <tabstop>gradientComboBox</tabstop>
+  <tabstop>thresholdAutoButton</tabstop>
+  <tabstop>okButton</tabstop>
+  <tabstop>thresholdManualButton</tabstop>
+  <tabstop>maxSpinBox</tabstop>
+  <tabstop>minSpinBox</tabstop>
+  <tabstop>cancelButton</tabstop>
+ </tabstops>
+ <resources/>
+ <connections/>
+</ui>