diff --git a/.changeset/nine-wasps-invent.md b/.changeset/nine-wasps-invent.md
new file mode 100644
index 0000000000..1952bb44ab
--- /dev/null
+++ b/.changeset/nine-wasps-invent.md
@@ -0,0 +1,5 @@
+---
+'@sumup/circuit-ui': patch
+---
+
+Fixed the alignment of the field validation hint icon.
diff --git a/packages/circuit-ui/components/FieldAtoms/FieldValidationHint.tsx b/packages/circuit-ui/components/FieldAtoms/FieldValidationHint.tsx
index ddbb7665fe..13ecb24c3e 100644
--- a/packages/circuit-ui/components/FieldAtoms/FieldValidationHint.tsx
+++ b/packages/circuit-ui/components/FieldAtoms/FieldValidationHint.tsx
@@ -32,7 +32,7 @@ export interface FieldValidationHintProps
 }
 
 const wrapperStyles = ({ theme }: StyleProps) => css`
-  display: block;
+  display: flex;
   margin-top: ${theme.spacings.bit};
   color: var(--cui-fg-subtle);
   transition: color ${theme.transitions.default};
@@ -86,11 +86,14 @@ const Wrapper = styled('span')<FieldValidationHintProps>(
 
 const iconWrapperStyles = ({ theme }: StyleProps) =>
   css`
-    display: inline-block;
-    position: relative;
+    display: block;
+    align-self: flex-start;
+    flex-shrink: 0;
     width: ${theme.iconSizes.kilo};
     height: ${theme.iconSizes.kilo};
-    vertical-align: text-top;
+    margin-top: calc(
+      (${theme.typography.body.two.lineHeight} - ${theme.iconSizes.kilo}) / 2
+    );
     margin-right: ${theme.spacings.bit};
   `;
 
diff --git a/packages/circuit-ui/components/ImageInput/__snapshots__/ImageInput.spec.tsx.snap b/packages/circuit-ui/components/ImageInput/__snapshots__/ImageInput.spec.tsx.snap
index 686f836669..401e152dab 100644
--- a/packages/circuit-ui/components/ImageInput/__snapshots__/ImageInput.spec.tsx.snap
+++ b/packages/circuit-ui/components/ImageInput/__snapshots__/ImageInput.spec.tsx.snap
@@ -1983,7 +1983,10 @@ exports[`ImageInput Styles should render with invalid styles and an error messag
 .circuit-13 {
   font-size: 0.875rem;
   line-height: 1.25rem;
-  display: block;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
   margin-top: 4px;
   color: var(--cui-fg-subtle);
   -webkit-transition: color 120ms ease-in-out;
@@ -2002,11 +2005,18 @@ exports[`ImageInput Styles should render with invalid styles and an error messag
 }
 
 .circuit-14 {
-  display: inline-block;
-  position: relative;
+  display: block;
+  -webkit-align-self: flex-start;
+  -ms-flex-item-align: flex-start;
+  align-self: flex-start;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
   width: 16px;
   height: 16px;
-  vertical-align: text-top;
+  margin-top: calc(
+        (1.25rem - 16px) / 2
+      );
   margin-right: 4px;
 }
 
diff --git a/packages/circuit-ui/components/Input/__snapshots__/Input.spec.tsx.snap b/packages/circuit-ui/components/Input/__snapshots__/Input.spec.tsx.snap
index e6aef6375d..d23e4d0275 100644
--- a/packages/circuit-ui/components/Input/__snapshots__/Input.spec.tsx.snap
+++ b/packages/circuit-ui/components/Input/__snapshots__/Input.spec.tsx.snap
@@ -295,7 +295,10 @@ exports[`Input Styles should render with a description when passed the validatio
 .circuit-6 {
   font-size: 0.875rem;
   line-height: 1.25rem;
-  display: block;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
   margin-top: 4px;
   color: var(--cui-fg-subtle);
   -webkit-transition: color 120ms ease-in-out;
diff --git a/packages/circuit-ui/components/Select/__snapshots__/Select.spec.tsx.snap b/packages/circuit-ui/components/Select/__snapshots__/Select.spec.tsx.snap
index 397005145a..16330cb44d 100644
--- a/packages/circuit-ui/components/Select/__snapshots__/Select.spec.tsx.snap
+++ b/packages/circuit-ui/components/Select/__snapshots__/Select.spec.tsx.snap
@@ -503,7 +503,10 @@ select:not(:active)~.circuit-7 {
 .circuit-8 {
   font-size: 0.875rem;
   line-height: 1.25rem;
-  display: block;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
   margin-top: 4px;
   color: var(--cui-fg-subtle);
   -webkit-transition: color 120ms ease-in-out;
diff --git a/packages/circuit-ui/components/TextArea/__snapshots__/TextArea.spec.tsx.snap b/packages/circuit-ui/components/TextArea/__snapshots__/TextArea.spec.tsx.snap
index 4f16a49cac..638da65f50 100644
--- a/packages/circuit-ui/components/TextArea/__snapshots__/TextArea.spec.tsx.snap
+++ b/packages/circuit-ui/components/TextArea/__snapshots__/TextArea.spec.tsx.snap
@@ -531,7 +531,10 @@ exports[`TextArea should render with a Tooltip when passed the validationHint pr
 .circuit-6 {
   font-size: 0.875rem;
   line-height: 1.25rem;
-  display: block;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
   margin-top: 4px;
   color: var(--cui-fg-subtle);
   -webkit-transition: color 120ms ease-in-out;