diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs
index 09d22f7ed..225cb1dfc 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs
@@ -68,6 +68,12 @@
         editing-text*  (mf/use-state false)
         editing-text?  (deref editing-text*)
 
+        opacity?
+        (and (not gradient-color?)
+             (not multiple-colors?)
+             (not library-color?)
+             (not disable-opacity))
+
         on-focus
         (mf/use-fn
          (mf/deps on-focus)
@@ -187,6 +193,7 @@
              :ref dref}
        [:span {:class (stl/css :color-info)}
         [:span {:class (stl/css-case :color-name-wrapper true
+                                     :no-opacity (not opacity?)
                                      :library-name-wrapper library-color?
                                      :editing editing-text?
                                      :gradient-name-wrapper gradient-color?)}
@@ -238,10 +245,7 @@
                              :on-blur on-blur
                              :on-change handle-value-change}]])]
 
-        (when (and (not gradient-color?)
-                   (not multiple-colors?)
-                   (not library-color?))
-
+        (when opacity?
           [:div {:class (stl/css :opacity-element-wrapper)}
            [:span {:class (stl/css :icon-text)}
             "%"]
@@ -263,14 +267,7 @@
                    :on-click handle-select}
           i/move-refactor])]
 
-
-
-
-
-
-
-
-
+      ;; OLD CSS
       [:div.row-flex.color-data {:title title
                                  :class (dom/classnames
                                          :dnd-over-top (= (:over dprops) :top)
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.scss b/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.scss
index 1af2b9683..0eb3e1a8f 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.scss
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.scss
@@ -24,6 +24,9 @@
       border-radius: $br-8 0 0 $br-8;
       padding: 0;
       margin-right: 0;
+      &.no-opacity {
+        border-radius: $br-8;
+      }
       .color-bullet-wrapper {
         height: $s-28;
         padding: 0 $s-2 0 $s-8;