diff --git a/src/Umbraco.Web.UI.Client/src/less/property-editors.less b/src/Umbraco.Web.UI.Client/src/less/property-editors.less
index 3bcf5db1b6..282a9cae7b 100644
--- a/src/Umbraco.Web.UI.Client/src/less/property-editors.less
+++ b/src/Umbraco.Web.UI.Client/src/less/property-editors.less
@@ -128,9 +128,16 @@ ul.color-picker li a  {
   width: 120px;
   text-align: center;
   color: @grayLight;
-  border: 2px @grayLight dashed !important;
+  border: 2px @grayLight dashed;
   line-height: 120px;
   text-decoration: none;
+
+  transition: all 150ms ease-in-out;
+
+  &:hover {
+      color: @gray;
+      border-color: @gray;
+  }
 }
 
 .umb-mediapicker .picked-image {