From d53ccb100806680039ad6d5429a614696efd5c87 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Connor=20B=C3=A4r?= <connor-baer@users.noreply.github.com>
Date: Thu, 8 Aug 2024 17:24:09 +0200
Subject: [PATCH] Switch ImageInput's button variant (#2642)

---
 .changeset/thick-games-rescue.md                         | 5 +++++
 packages/circuit-ui/components/ImageInput/ImageInput.tsx | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/thick-games-rescue.md

diff --git a/.changeset/thick-games-rescue.md b/.changeset/thick-games-rescue.md
new file mode 100644
index 0000000000..190fc60d49
--- /dev/null
+++ b/.changeset/thick-games-rescue.md
@@ -0,0 +1,5 @@
+---
+'@sumup/circuit-ui': minor
+---
+
+Switched the ImageInput's button variant from `primary` to `secondary` to improve its appearance on dark backgrounds.
diff --git a/packages/circuit-ui/components/ImageInput/ImageInput.tsx b/packages/circuit-ui/components/ImageInput/ImageInput.tsx
index 022d07d2ba..721153cfaf 100644
--- a/packages/circuit-ui/components/ImageInput/ImageInput.tsx
+++ b/packages/circuit-ui/components/ImageInput/ImageInput.tsx
@@ -264,7 +264,7 @@ export const ImageInput = ({
           <IconButton
             type="button"
             size="s"
-            variant="primary"
+            variant="secondary"
             destructive
             onClick={handleClear}
             disabled={isLoading || disabled}
@@ -277,7 +277,7 @@ export const ImageInput = ({
           <IconButton
             type="button"
             size="s"
-            variant="primary"
+            variant="secondary"
             aria-hidden="true"
             tabIndex={-1}
             disabled={isLoading || disabled}