diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-color-swatches.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-color-swatches.html
index 24aa29125e..74c010307a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-color-swatches.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-color-swatches.html
@@ -3,7 +3,7 @@
     <button type="button" class="umb-color-box umb-color-box--{{size}} btn-{{color.value}}" ng-repeat="color in colors" title="{{useLabel || useColorClass ? (color.label || color.value) : ('#' + color.value)}}" hex-bg-inline="{{useColorClass === false}}" hex-bg-color="{{color.value}}" ng-class="{ 'active': color.value === selectedColor }" ng-click="setColor(color.value, $index, $event)">
         <div class="umb-color-box-inner">
             <div class="check_circle">
-                <i class="icon icon-check small" ng-show="color.value === selectedColor"></i>
+                <i class="icon icon-check small" ng-show="selectedColor && color.value === selectedColor.value"></i>
             </div>
             <div class="umb-color-box__label" ng-if="useLabel">
                 <div class="umb-color-box__name truncate">{{ color.label || color.value }}</div>