diff --git a/front/src/modules/ui/input/checkbox/components/Checkbox.tsx b/front/src/modules/ui/input/checkbox/components/Checkbox.tsx
index 82c2ed4b3..a4ec455d7 100644
--- a/front/src/modules/ui/input/checkbox/components/Checkbox.tsx
+++ b/front/src/modules/ui/input/checkbox/components/Checkbox.tsx
@@ -59,10 +59,10 @@ const StyledInput = styled.input<{
   & + label:before {
     --size: ${({ checkboxSize }) =>
       checkboxSize === CheckboxSize.Large ? '18px' : '12px'};
-    background: ${({ theme, indeterminate }) =>
-      indeterminate ? theme.color.blue : 'transparent'};
-    border-color: ${({ theme, indeterminate, variant }) =>
-      indeterminate
+    background: ${({ theme, indeterminate, isChecked }) =>
+      indeterminate || isChecked ? theme.color.blue : 'transparent'};
+    border-color: ${({ theme, indeterminate, isChecked, variant }) =>
+      indeterminate || isChecked
         ? theme.color.blue
         : variant === CheckboxVariant.Primary
         ? theme.border.color.inverted
@@ -80,13 +80,6 @@ const StyledInput = styled.input<{
     width: var(--size);
   }
 
-  & + label:before {
-    background: ${({ theme, isChecked }) =>
-      isChecked ? theme.color.blue : 'inherit'};
-    border-color: ${({ theme, isChecked }) =>
-      isChecked ? theme.color.blue : 'inherit'};
-  }
-
   & + label > svg {
     --padding: ${({ checkboxSize }) =>
       checkboxSize === CheckboxSize.Large ? '2px' : '1px'};