diff --git a/src/slic3r/GUI/BitmapCache.cpp b/src/slic3r/GUI/BitmapCache.cpp
index 9e6d50fe2..4f6d4006c 100644
--- a/src/slic3r/GUI/BitmapCache.cpp
+++ b/src/slic3r/GUI/BitmapCache.cpp
@@ -334,8 +334,8 @@ wxBitmap* BitmapCache::load_svg(const std::string &bitmap_name, unsigned target_
         replaces["\"#909090\""] = "\"#FFFFFF\"";
         replaces["\"#00FF00\""] = "\"#FF0000\"";
     }
-    //if (!new_color.empty())
-    //    replaces["\"#ED6B21\""] = "\"" + new_color + "\"";
+    if (!new_color.empty())
+        replaces["\"#00AE42\""] = "\"" + new_color + "\"";
 
      NSVGimage *image = nullptr;
     if (strstr(bitmap_name.c_str(), "printer_thumbnail") == NULL) {
diff --git a/src/slic3r/GUI/DragDropPanel.cpp b/src/slic3r/GUI/DragDropPanel.cpp
index 33926e8d0..fffa97564 100644
--- a/src/slic3r/GUI/DragDropPanel.cpp
+++ b/src/slic3r/GUI/DragDropPanel.cpp
@@ -1,6 +1,8 @@
 #include "DragDropPanel.hpp"
+#include <slic3r/GUI/wxExtensions.hpp>
 
 namespace Slic3r { namespace GUI {
+
 // Custom data object used to store information that needs to be backed up during drag and drop
 class ColorDataObject : public wxDataObjectSimple
 {
@@ -65,9 +67,8 @@ private:
 ///////////////   ColorPanel  start ////////////////////////
 // The UI panel of drag item
 ColorPanel::ColorPanel(DragDropPanel *parent, const wxColour &color, int filament_id)
-    : wxPanel(parent, wxID_ANY, wxDefaultPosition, wxSize(50, 50), wxBORDER_SIMPLE), m_parent(parent), m_color(color), m_filament_id(filament_id)
+    : wxPanel(parent, wxID_ANY, wxDefaultPosition, wxSize(32, 40), wxBORDER_NONE), m_parent(parent), m_color(color), m_filament_id(filament_id)
 {
-    SetBackgroundColour(color);
     Bind(wxEVT_LEFT_DOWN, &ColorPanel::OnLeftDown, this);
     Bind(wxEVT_LEFT_UP, &ColorPanel::OnLeftUp, this);
     Bind(wxEVT_PAINT, &ColorPanel::OnPaint, this);
@@ -85,6 +86,9 @@ void ColorPanel::OnPaint(wxPaintEvent &event)
 {
     wxPaintDC dc(this);
     wxSize   size  = GetSize();
+    std::string replace_color = m_color.GetAsString(wxC2S_HTML_SYNTAX).ToStdString();
+    wxBitmap bmp = ScalableBitmap(this, "filament_green", 40, false, false, false, { replace_color }).bmp();
+    dc.DrawBitmap(bmp, wxPoint(0,0));
     wxString label = wxString::Format(wxT("%d"), m_filament_id);
     dc.SetTextForeground(m_color.GetLuminance() < 0.51 ? *wxWHITE : *wxBLACK);  // set text color
     dc.DrawLabel(label, wxRect(0, 0, size.GetWidth(), size.GetHeight()), wxALIGN_CENTER);
@@ -153,17 +157,26 @@ wxDragResult ColorDropTarget::OnData(wxCoord x, wxCoord y, wxDragResult def)
 
 
 DragDropPanel::DragDropPanel(wxWindow *parent, const wxString &label, bool is_auto)
-    : wxPanel(parent, wxID_ANY, wxDefaultPosition, wxDefaultSize, wxBORDER_SIMPLE)
+    : wxPanel(parent, wxID_ANY, wxDefaultPosition, wxDefaultSize, wxBORDER_NONE)
     , m_is_auto(is_auto)
 {
-    SetBackgroundColour(*wxLIGHT_GREY);
+    SetBackgroundColour(0xF8F8F8);
 
     m_sizer    = new wxBoxSizer(wxVERTICAL);
+
+    auto title_panel = new wxPanel(this);
+    title_panel->SetBackgroundColour(0xEEEEEE);
+    auto title_sizer = new wxBoxSizer(wxHORIZONTAL);
+    title_panel->SetSizer(title_sizer);
+
     wxStaticText *staticText = new wxStaticText(this, wxID_ANY, label);
-    m_sizer->Add(staticText, 0, wxALIGN_CENTER | wxALL, 5);
+    staticText->SetBackgroundColour(0xEEEEEE);
+    title_sizer->Add(staticText, 0, wxALIGN_CENTER | wxALL, FromDIP(5));
+
+    m_sizer->Add(title_panel, 0, wxEXPAND);
     m_sizer->AddSpacer(20);
 
-    m_grid_item_sizer = new wxGridSizer(0, 3, 10, 10);   // row = 0, col = 3,  10 10 is space
+    m_grid_item_sizer = new wxGridSizer(0, 5, FromDIP(10), 0);   // row = 0, col = 3,  10 10 is space
     m_sizer->Add(m_grid_item_sizer);
 
     // set droptarget
@@ -177,8 +190,8 @@ DragDropPanel::DragDropPanel(wxWindow *parent, const wxString &label, bool is_au
 void DragDropPanel::AddColorBlock(const wxColour &color, int filament_id, bool update_ui)
 {
     ColorPanel *panel = new ColorPanel(this, color, filament_id);
-    panel->SetMinSize(wxSize(50, 50));
-    m_grid_item_sizer->Add(panel, 0, wxALIGN_CENTER | wxALL, 5);
+    panel->SetMinSize(wxSize(FromDIP(32), FromDIP(40)));
+    m_grid_item_sizer->Add(panel, 0, wxALIGN_CENTER | wxLEFT, FromDIP(10));
     m_filament_blocks.push_back(panel);
     if (update_ui) {
         Layout();
diff --git a/src/slic3r/GUI/DragDropPanel.hpp b/src/slic3r/GUI/DragDropPanel.hpp
index 5e26f9ada..3bcb6ecf6 100644
--- a/src/slic3r/GUI/DragDropPanel.hpp
+++ b/src/slic3r/GUI/DragDropPanel.hpp
@@ -45,7 +45,7 @@ class ColorPanel : public wxPanel
 public:
     ColorPanel(DragDropPanel *parent, const wxColour &color, int filament_id);
 
-    wxColour GetColor() const { return GetBackgroundColour(); }
+    wxColour GetColor() const { return m_color; }
     int      GetFilamentId() const { return m_filament_id; }
 
 private:
diff --git a/src/slic3r/GUI/FilamentMapDialog.cpp b/src/slic3r/GUI/FilamentMapDialog.cpp
index 6863e31b0..f82128a76 100644
--- a/src/slic3r/GUI/FilamentMapDialog.cpp
+++ b/src/slic3r/GUI/FilamentMapDialog.cpp
@@ -81,7 +81,7 @@ FilamentMapDialog::FilamentMapDialog(wxWindow *parent,
     main_sizer->Add(m_mode_switch_btn, 0, wxCENTER | wxALL, 10);
 
     m_tip_text = new wxStaticText(this, wxID_ANY, "", wxDefaultPosition, wxDefaultSize, wxALIGN_LEFT);
-    main_sizer->Add(m_tip_text, 0, wxALIGN_LEFT | wxALL, 5);
+    main_sizer->Add(m_tip_text, 0, wxALIGN_LEFT | wxLEFT, 15);
 
     m_extruder_panel_sizer = new wxBoxSizer(wxHORIZONTAL);
 
@@ -105,11 +105,11 @@ FilamentMapDialog::FilamentMapDialog(wxWindow *parent,
         }
     }
 
-    m_switch_filament_btn = new Button(this, "", "switch_filament_maps", 12, 12);
+    m_switch_filament_btn = new ScalableButton(this, wxID_ANY, "switch_filament_maps");
     m_switch_filament_btn->Bind(wxEVT_BUTTON, &FilamentMapDialog::on_switch_filaments, this);
     m_switch_filament_btn->SetCanFocus(false);
     // just for placeholder for auto
-    m_switch_filament_btn_auto = new Button(this, "", "switch_filament_maps", 12, 12);
+    m_switch_filament_btn_auto = new ScalableButton(this, wxID_ANY, "switch_filament_maps");
     m_switch_filament_btn_auto->Enable(false);
 
     m_extruder_panel_sizer->Add(m_manual_left_panel, 1, wxEXPAND | wxALL, 5);
diff --git a/src/slic3r/GUI/FilamentMapDialog.hpp b/src/slic3r/GUI/FilamentMapDialog.hpp
index 728a03626..635b0122b 100644
--- a/src/slic3r/GUI/FilamentMapDialog.hpp
+++ b/src/slic3r/GUI/FilamentMapDialog.hpp
@@ -8,6 +8,7 @@
 #include <vector>
 
 class SwitchButton;
+class ScalableButton;
 class Button;
 class wxStaticText;
 
@@ -44,8 +45,8 @@ private:
     DragDropPanel* m_manual_right_panel;
     DragDropPanel* m_auto_left_panel;
     DragDropPanel* m_auto_right_panel;
-    Button       * m_switch_filament_btn;
-    Button       * m_switch_filament_btn_auto; // for placeholder
+    ScalableButton* m_switch_filament_btn;
+    ScalableButton* m_switch_filament_btn_auto; // for placeholder
 
 private:
     const DynamicPrintConfig* m_config;
diff --git a/src/slic3r/GUI/wxExtensions.cpp b/src/slic3r/GUI/wxExtensions.cpp
index ee65d9adb..114c3c04f 100644
--- a/src/slic3r/GUI/wxExtensions.cpp
+++ b/src/slic3r/GUI/wxExtensions.cpp
@@ -888,7 +888,7 @@ ScalableBitmap::ScalableBitmap( wxWindow *parent,
     m_parent(parent), m_icon_name(icon_name),
     m_px_cnt(px_cnt), m_grayscale(grayscale), m_resize(resize) // BBS: support resize by fill border
 {
-    m_bmp = create_scaled_bitmap(icon_name, parent, px_cnt, m_grayscale, std::string(), false, resize, bitmap2, new_color);
+    m_bmp = create_scaled_bitmap(icon_name, parent, px_cnt, m_grayscale, new_color.empty() ? std::string() : new_color.front(), false, resize, bitmap2, new_color);
     if (px_cnt == 0) {
         m_px_cnt = m_bmp.GetHeight(); // scale
         unsigned int height = (unsigned int) (parent->FromDIP(m_px_cnt) + 0.5f);