diff --git a/src/browser/base/content/zen-styles/zen-gradient-generator.css b/src/browser/base/content/zen-styles/zen-gradient-generator.css
index 75c5acc3c..15f63961b 100644
--- a/src/browser/base/content/zen-styles/zen-gradient-generator.css
+++ b/src/browser/base/content/zen-styles/zen-gradient-generator.css
@@ -188,7 +188,7 @@
     transition: transform 0.2s;
     transform: translate(-50%, -50%);
 
-    &.primary {
+    &:first-of-type {
       width: 28px;
       height: 28px;
       border-width: 3px;
diff --git a/src/browser/base/zen-components/ZenGradientGenerator.mjs b/src/browser/base/zen-components/ZenGradientGenerator.mjs
index ecf160e34..6c4cc1c23 100644
--- a/src/browser/base/zen-components/ZenGradientGenerator.mjs
+++ b/src/browser/base/zen-components/ZenGradientGenerator.mjs
@@ -309,7 +309,6 @@
           existingPrimaryDot.ID = this.dots.length;
           existingPrimaryDot.element.classList.remove('primary');
         }
-        dot.classList.add('primary');
       }
 
       const colorFromPos = this.getColorFromPosition(relativePosition.x, relativePosition.y);