diff --git a/src/_sass/_colors.scss b/src/_sass/_colors.scss
index db63960..7a02e51 100644
--- a/src/_sass/_colors.scss
+++ b/src/_sass/_colors.scss
@@ -115,6 +115,7 @@ $titlebar-backdrop:                     if($topbar == 'dark', background(g), bac
 $keyboard:                              if($variant == 'light', $grey-050, $grey-800); // for gnome-shell keyboard
 $keyboard-alt:                          if($variant == 'light', $grey-300, $grey-900); // for gnome-shell keyboard
 $system:                                if($blackness == 'true', $grey-850, $grey-800); // for gnome-shell keyboard
+$popover:                               if($variant == 'light', background(a), background(e));
 
 $panel-solid:                           if($topbar == 'dark', background(e), background(c)); // for Unity panel which doesn't allow translucent colors
 $panel:                                 if($opacity == 'default', rgba($panel-solid, 0.65), $panel-solid);
diff --git a/src/_sass/gnome-shell/widgets/_popovers-42.scss b/src/_sass/gnome-shell/widgets/_popovers-42.scss
index 8618ea3..f2bd4f5 100644
--- a/src/_sass/gnome-shell/widgets/_popovers-42.scss
+++ b/src/_sass/gnome-shell/widgets/_popovers-42.scss
@@ -25,7 +25,7 @@
   .popup-menu-content {
     padding: $space-size;
     margin: 0 3px 14px;
-    background-color: $surface;
+    background-color: if($opacity == 'solid', $popover, rgba($popover, 0.96));
     border-radius: $popup-radius;
     border: none;
     box-shadow: $shell-shadow-z3;
diff --git a/src/_sass/gnome-shell/widgets/_popovers.scss b/src/_sass/gnome-shell/widgets/_popovers.scss
index b3dc260..71ebea7 100644
--- a/src/_sass/gnome-shell/widgets/_popovers.scss
+++ b/src/_sass/gnome-shell/widgets/_popovers.scss
@@ -26,7 +26,7 @@
 .popup-menu-content {
   padding: $space-size 0;
   margin: $space-size 10px 13px 10px;
-  background-color: $surface;
+  background-color: if($opacity == 'solid', $popover, rgba($popover, 0.96));
   border-radius: $popup-radius;
   box-shadow: $shell-shadow-z3;
 }
diff --git a/src/_sass/gtk/apps/_gnome-4.0.scss b/src/_sass/gtk/apps/_gnome-4.0.scss
index cfd272e..2f42fe7 100644
--- a/src/_sass/gtk/apps/_gnome-4.0.scss
+++ b/src/_sass/gtk/apps/_gnome-4.0.scss
@@ -765,3 +765,36 @@ window.dialog {
     }
   }
 }
+
+//
+// Rnote
+//
+
+@function gtkcolor($c) {
+  @return unquote("@#{$c}");
+}
+
+button.colorpad {
+    padding: 0px;
+    margin: 0px;
+    background-blend-mode: screen;
+    background-image:
+        linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55),
+        linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+    background-color: gtkcolor(colorpad_color);
+    color:  gtkcolor(colorpad_fg_color);
+    background-size: 18px 18px;
+    background-position: 0px 0px, 9px 9px;
+
+    &:hover {
+        filter: brightness(93%);
+    }
+
+    &:active {
+        filter: brightness(86%);
+    }
+
+    &:checked {
+        filter: brightness(100%);
+    }
+}
diff --git a/src/_sass/gtk/apps/_mate.scss b/src/_sass/gtk/apps/_mate.scss
index e5b768b..458579d 100644
--- a/src/_sass/gtk/apps/_mate.scss
+++ b/src/_sass/gtk/apps/_mate.scss
@@ -171,14 +171,14 @@ na-tray-applet {
 }
 
 // remove right space a bit
-na-tray-applet > widget > box {
-  // margin-right: 2px;
-}
+// na-tray-applet > widget > box {
+//   margin-right: 2px;
+// }
 
 // no background for icon-padding area
-na-tray-applet widget box widget {
-  // background-color: transparent;
-}
+// na-tray-applet widget box widget {
+//   background-color: transparent;
+// }
 
 // Classic icon style
 .mate-panel-menu-bar {
diff --git a/src/_sass/gtk/apps/_misc.scss b/src/_sass/gtk/apps/_misc.scss
index 7ee35e2..2c1d4b0 100644
--- a/src/_sass/gtk/apps/_misc.scss
+++ b/src/_sass/gtk/apps/_misc.scss
@@ -397,8 +397,8 @@ window.background.csd {
 window.background:not(.solid-csd):not(.csd) {
   // reserved area at the most-right side of GtkMenuBar
   > grid.horizontal > grid.horizontal {
-    background-color: $titlebar;
-    box-shadow: inset 0 -1px $divider;
+    background-color: transparent;
+    // box-shadow: inset 0 -1px $divider;
 
     // > button.flat.small-button { // 'close' button
     // }
diff --git a/src/_sass/gtk/apps/_xfce.scss b/src/_sass/gtk/apps/_xfce.scss
index 7993a43..be8b886 100644
--- a/src/_sass/gtk/apps/_xfce.scss
+++ b/src/_sass/gtk/apps/_xfce.scss
@@ -100,9 +100,6 @@ XfdesktopIconView.view {
   // Set the application icon- and preview-size to 64px
   -XfwmTabwinWidget-icon-size: 64px;
   -XfwmTabwinWidget-preview-size: 64px;
-
-  button {
-  }
 }
 
 
diff --git a/src/gnome-shell/shell-40-0/gnome-shell-Compact.css b/src/gnome-shell/shell-40-0/gnome-shell-Compact.css
index f99faa9..a42ef48 100644
--- a/src/gnome-shell/shell-40-0/gnome-shell-Compact.css
+++ b/src/gnome-shell/shell-40-0/gnome-shell-Compact.css
@@ -460,7 +460,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu-content {
   padding: 4px 0;
   margin: 4px 10px 13px 10px;
-  background-color: #FFFFFF;
+  background-color: rgba(255, 255, 255, 0.96);
   border-radius: 18px;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
 }
diff --git a/src/gnome-shell/shell-40-0/gnome-shell-Dark-Compact.css b/src/gnome-shell/shell-40-0/gnome-shell-Dark-Compact.css
index a21d2b4..f7acba1 100644
--- a/src/gnome-shell/shell-40-0/gnome-shell-Dark-Compact.css
+++ b/src/gnome-shell/shell-40-0/gnome-shell-Dark-Compact.css
@@ -460,7 +460,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu-content {
   padding: 4px 0;
   margin: 4px 10px 13px 10px;
-  background-color: #3C3C3C;
+  background-color: rgba(33, 33, 33, 0.96);
   border-radius: 18px;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
 }
diff --git a/src/gnome-shell/shell-40-0/gnome-shell-Dark.css b/src/gnome-shell/shell-40-0/gnome-shell-Dark.css
index ce31a64..26af7f5 100644
--- a/src/gnome-shell/shell-40-0/gnome-shell-Dark.css
+++ b/src/gnome-shell/shell-40-0/gnome-shell-Dark.css
@@ -460,7 +460,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu-content {
   padding: 6px 0;
   margin: 6px 10px 13px 10px;
-  background-color: #3C3C3C;
+  background-color: rgba(33, 33, 33, 0.96);
   border-radius: 20px;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
 }
diff --git a/src/gnome-shell/shell-40-0/gnome-shell.css b/src/gnome-shell/shell-40-0/gnome-shell.css
index c28175d..d53b394 100644
--- a/src/gnome-shell/shell-40-0/gnome-shell.css
+++ b/src/gnome-shell/shell-40-0/gnome-shell.css
@@ -460,7 +460,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu-content {
   padding: 6px 0;
   margin: 6px 10px 13px 10px;
-  background-color: #FFFFFF;
+  background-color: rgba(255, 255, 255, 0.96);
   border-radius: 20px;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
 }
diff --git a/src/gnome-shell/shell-42-0/gnome-shell-Compact.css b/src/gnome-shell/shell-42-0/gnome-shell-Compact.css
index 0af4917..f5017d4 100644
--- a/src/gnome-shell/shell-42-0/gnome-shell-Compact.css
+++ b/src/gnome-shell/shell-42-0/gnome-shell-Compact.css
@@ -515,7 +515,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu .popup-menu-content {
   padding: 4px;
   margin: 0 3px 14px;
-  background-color: #FFFFFF;
+  background-color: rgba(255, 255, 255, 0.96);
   border-radius: 18px;
   border: none;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
diff --git a/src/gnome-shell/shell-42-0/gnome-shell-Dark-Compact.css b/src/gnome-shell/shell-42-0/gnome-shell-Dark-Compact.css
index 7b038ff..956d9df 100644
--- a/src/gnome-shell/shell-42-0/gnome-shell-Dark-Compact.css
+++ b/src/gnome-shell/shell-42-0/gnome-shell-Dark-Compact.css
@@ -515,7 +515,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu .popup-menu-content {
   padding: 4px;
   margin: 0 3px 14px;
-  background-color: #3C3C3C;
+  background-color: rgba(33, 33, 33, 0.96);
   border-radius: 18px;
   border: none;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
diff --git a/src/gnome-shell/shell-42-0/gnome-shell-Dark.css b/src/gnome-shell/shell-42-0/gnome-shell-Dark.css
index c7a76b3..11de637 100644
--- a/src/gnome-shell/shell-42-0/gnome-shell-Dark.css
+++ b/src/gnome-shell/shell-42-0/gnome-shell-Dark.css
@@ -515,7 +515,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu .popup-menu-content {
   padding: 6px;
   margin: 0 3px 14px;
-  background-color: #3C3C3C;
+  background-color: rgba(33, 33, 33, 0.96);
   border-radius: 20px;
   border: none;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
diff --git a/src/gnome-shell/shell-42-0/gnome-shell.css b/src/gnome-shell/shell-42-0/gnome-shell.css
index a20e7bf..de50bf0 100644
--- a/src/gnome-shell/shell-42-0/gnome-shell.css
+++ b/src/gnome-shell/shell-42-0/gnome-shell.css
@@ -515,7 +515,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
 .popup-menu .popup-menu-content {
   padding: 6px;
   margin: 0 3px 14px;
-  background-color: #FFFFFF;
+  background-color: rgba(255, 255, 255, 0.96);
   border-radius: 20px;
   border: none;
   box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
diff --git a/src/gtk/3.0/gtk-Compact.css b/src/gtk/3.0/gtk-Compact.css
index c40ffa7..9350c29 100644
--- a/src/gtk/3.0/gtk-Compact.css
+++ b/src/gtk/3.0/gtk-Compact.css
@@ -6329,8 +6329,7 @@ window.background.csd > box.vertical > overlay > stack > scrolledwindow.frame >
 }
 
 window.background:not(.solid-csd):not(.csd) > grid.horizontal > grid.horizontal {
-  background-color: #2C2C2C;
-  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
+  background-color: transparent;
 }
 
 window.background:not(.solid-csd):not(.csd) > notebook:not(.frame) {
diff --git a/src/gtk/3.0/gtk-Dark-Compact.css b/src/gtk/3.0/gtk-Dark-Compact.css
index f9b29fb..b5e9a2a 100644
--- a/src/gtk/3.0/gtk-Dark-Compact.css
+++ b/src/gtk/3.0/gtk-Dark-Compact.css
@@ -6325,8 +6325,7 @@ window.background.csd > box.vertical > overlay > stack > scrolledwindow.frame >
 }
 
 window.background:not(.solid-csd):not(.csd) > grid.horizontal > grid.horizontal {
-  background-color: #2C2C2C;
-  box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
+  background-color: transparent;
 }
 
 window.background:not(.solid-csd):not(.csd) > notebook:not(.frame) {
diff --git a/src/gtk/3.0/gtk-Dark.css b/src/gtk/3.0/gtk-Dark.css
index 8027cb0..d34f935 100644
--- a/src/gtk/3.0/gtk-Dark.css
+++ b/src/gtk/3.0/gtk-Dark.css
@@ -6325,8 +6325,7 @@ window.background.csd > box.vertical > overlay > stack > scrolledwindow.frame >
 }
 
 window.background:not(.solid-csd):not(.csd) > grid.horizontal > grid.horizontal {
-  background-color: #2C2C2C;
-  box-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
+  background-color: transparent;
 }
 
 window.background:not(.solid-csd):not(.csd) > notebook:not(.frame) {
diff --git a/src/gtk/3.0/gtk-Light-Compact.css b/src/gtk/3.0/gtk-Light-Compact.css
index f4ddceb..28574bc 100644
--- a/src/gtk/3.0/gtk-Light-Compact.css
+++ b/src/gtk/3.0/gtk-Light-Compact.css
@@ -6328,8 +6328,7 @@ window.background.csd > box.vertical > overlay > stack > scrolledwindow.frame >
 }
 
 window.background:not(.solid-csd):not(.csd) > grid.horizontal > grid.horizontal {
-  background-color: #FFFFFF;
-  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
+  background-color: transparent;
 }
 
 window.background:not(.solid-csd):not(.csd) > notebook:not(.frame) {
diff --git a/src/gtk/3.0/gtk-Light.css b/src/gtk/3.0/gtk-Light.css
index a095656..60124d8 100644
--- a/src/gtk/3.0/gtk-Light.css
+++ b/src/gtk/3.0/gtk-Light.css
@@ -6328,8 +6328,7 @@ window.background.csd > box.vertical > overlay > stack > scrolledwindow.frame >
 }
 
 window.background:not(.solid-csd):not(.csd) > grid.horizontal > grid.horizontal {
-  background-color: #FFFFFF;
-  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
+  background-color: transparent;
 }
 
 window.background:not(.solid-csd):not(.csd) > notebook:not(.frame) {
diff --git a/src/gtk/3.0/gtk.css b/src/gtk/3.0/gtk.css
index 77849e5..da8513c 100644
--- a/src/gtk/3.0/gtk.css
+++ b/src/gtk/3.0/gtk.css
@@ -6329,8 +6329,7 @@ window.background.csd > box.vertical > overlay > stack > scrolledwindow.frame >
 }
 
 window.background:not(.solid-csd):not(.csd) > grid.horizontal > grid.horizontal {
-  background-color: #2C2C2C;
-  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.12);
+  background-color: transparent;
 }
 
 window.background:not(.solid-csd):not(.csd) > notebook:not(.frame) {
diff --git a/src/gtk/4.0/gtk-Compact.css b/src/gtk/4.0/gtk-Compact.css
index f3fd330..ce1fe36 100644
--- a/src/gtk/4.0/gtk-Compact.css
+++ b/src/gtk/4.0/gtk-Compact.css
@@ -5458,6 +5458,29 @@ window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.b
   border-radius: 0;
 }
 
+button.colorpad {
+  padding: 0px;
+  margin: 0px;
+  background-blend-mode: screen;
+  background-image: linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55), linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+  background-color: @colorpad_color;
+  color: @colorpad_fg_color;
+  background-size: 18px 18px;
+  background-position: 0px 0px, 9px 9px;
+}
+
+button.colorpad:hover {
+  filter: brightness(93%);
+}
+
+button.colorpad:active {
+  filter: brightness(86%);
+}
+
+button.colorpad:checked {
+  filter: brightness(100%);
+}
+
 avatar {
   border-radius: 9999px;
   font-weight: bold;
diff --git a/src/gtk/4.0/gtk-Dark-Compact.css b/src/gtk/4.0/gtk-Dark-Compact.css
index b66e753..17c0d82 100644
--- a/src/gtk/4.0/gtk-Dark-Compact.css
+++ b/src/gtk/4.0/gtk-Dark-Compact.css
@@ -5428,6 +5428,29 @@ window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.b
   border-radius: 0;
 }
 
+button.colorpad {
+  padding: 0px;
+  margin: 0px;
+  background-blend-mode: screen;
+  background-image: linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55), linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+  background-color: @colorpad_color;
+  color: @colorpad_fg_color;
+  background-size: 18px 18px;
+  background-position: 0px 0px, 9px 9px;
+}
+
+button.colorpad:hover {
+  filter: brightness(93%);
+}
+
+button.colorpad:active {
+  filter: brightness(86%);
+}
+
+button.colorpad:checked {
+  filter: brightness(100%);
+}
+
 avatar {
   border-radius: 9999px;
   font-weight: bold;
diff --git a/src/gtk/4.0/gtk-Dark.css b/src/gtk/4.0/gtk-Dark.css
index c196686..4347965 100644
--- a/src/gtk/4.0/gtk-Dark.css
+++ b/src/gtk/4.0/gtk-Dark.css
@@ -5428,6 +5428,29 @@ window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.b
   border-radius: 0;
 }
 
+button.colorpad {
+  padding: 0px;
+  margin: 0px;
+  background-blend-mode: screen;
+  background-image: linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55), linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+  background-color: @colorpad_color;
+  color: @colorpad_fg_color;
+  background-size: 18px 18px;
+  background-position: 0px 0px, 9px 9px;
+}
+
+button.colorpad:hover {
+  filter: brightness(93%);
+}
+
+button.colorpad:active {
+  filter: brightness(86%);
+}
+
+button.colorpad:checked {
+  filter: brightness(100%);
+}
+
 avatar {
   border-radius: 9999px;
   font-weight: bold;
diff --git a/src/gtk/4.0/gtk-Light-Compact.css b/src/gtk/4.0/gtk-Light-Compact.css
index fa0fe15..1cd514e 100644
--- a/src/gtk/4.0/gtk-Light-Compact.css
+++ b/src/gtk/4.0/gtk-Light-Compact.css
@@ -5412,6 +5412,29 @@ window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.b
   border-radius: 0;
 }
 
+button.colorpad {
+  padding: 0px;
+  margin: 0px;
+  background-blend-mode: screen;
+  background-image: linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55), linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+  background-color: @colorpad_color;
+  color: @colorpad_fg_color;
+  background-size: 18px 18px;
+  background-position: 0px 0px, 9px 9px;
+}
+
+button.colorpad:hover {
+  filter: brightness(93%);
+}
+
+button.colorpad:active {
+  filter: brightness(86%);
+}
+
+button.colorpad:checked {
+  filter: brightness(100%);
+}
+
 avatar {
   border-radius: 9999px;
   font-weight: bold;
diff --git a/src/gtk/4.0/gtk-Light.css b/src/gtk/4.0/gtk-Light.css
index d818562..67d6a5e 100644
--- a/src/gtk/4.0/gtk-Light.css
+++ b/src/gtk/4.0/gtk-Light.css
@@ -5412,6 +5412,29 @@ window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.b
   border-radius: 0;
 }
 
+button.colorpad {
+  padding: 0px;
+  margin: 0px;
+  background-blend-mode: screen;
+  background-image: linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55), linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+  background-color: @colorpad_color;
+  color: @colorpad_fg_color;
+  background-size: 18px 18px;
+  background-position: 0px 0px, 9px 9px;
+}
+
+button.colorpad:hover {
+  filter: brightness(93%);
+}
+
+button.colorpad:active {
+  filter: brightness(86%);
+}
+
+button.colorpad:checked {
+  filter: brightness(100%);
+}
+
 avatar {
   border-radius: 9999px;
   font-weight: bold;
diff --git a/src/gtk/4.0/gtk.css b/src/gtk/4.0/gtk.css
index 5bb5119..7d058d0 100644
--- a/src/gtk/4.0/gtk.css
+++ b/src/gtk/4.0/gtk.css
@@ -5458,6 +5458,29 @@ window.dialog > .dialog-vbox > box > scrolledwindow > viewport > widget > list.b
   border-radius: 0;
 }
 
+button.colorpad {
+  padding: 0px;
+  margin: 0px;
+  background-blend-mode: screen;
+  background-image: linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55), linear-gradient(45deg, #0f0f0f55 25%, transparent 25%, transparent 75%, #0f0f0f55 75%, #0f0f0f55);
+  background-color: @colorpad_color;
+  color: @colorpad_fg_color;
+  background-size: 18px 18px;
+  background-position: 0px 0px, 9px 9px;
+}
+
+button.colorpad:hover {
+  filter: brightness(93%);
+}
+
+button.colorpad:active {
+  filter: brightness(86%);
+}
+
+button.colorpad:checked {
+  filter: brightness(100%);
+}
+
 avatar {
   border-radius: 9999px;
   font-weight: bold;