diff --git a/docs/changelog/README.md b/docs/changelog/README.md
index 95c1d5c6..e5f5b12c 100644
--- a/docs/changelog/README.md
+++ b/docs/changelog/README.md
@@ -3,6 +3,7 @@
 ## Unreleased
 
 - :bug: Let the Image always fit the whole widget.
+- :bug: Fix the Input clear button on macOS.
 - :book: Update documentation.
 
 ## 1.1.3 (2020-01-14)
diff --git a/src/components/forms/input/index.tsx b/src/components/forms/input/index.tsx
index cd888595..0a190c54 100644
--- a/src/components/forms/input/index.tsx
+++ b/src/components/forms/input/index.tsx
@@ -26,11 +26,14 @@ const Input: React.FC<Props> = memo(props => {
   } = props;
   const [isFocused, setFocused] = useState(false);
   const { t } = useTranslation();
+  const clearValue = () => setValue("");
   return (
     <Label text={label}>
       <div
         className="w-full relative"
-        onFocus={event => {
+        // replace with onFocusIn / onFocusOut when implemented in React:
+        // https://github.com/facebook/react/issues/6410
+        onFocus={() => {
           setFocused(true);
         }}
         onBlur={event => {
@@ -60,7 +63,8 @@ const Input: React.FC<Props> = memo(props => {
             className="absolute right-0 h-full"
             size={ButtonSize.Small}
             variant={ButtonVariant.Unstyled}
-            onClick={() => setValue("")}
+            onClick={clearValue}
+            onMouseDown={clearValue}
             aria-label={t("common.clear")}
           >
             <Icon name="times" />