diff --git a/src/core/client/ui/components/ValidationMessage/ValidationMessage.css b/src/core/client/ui/components/ValidationMessage/ValidationMessage.css
index 9decc5580..4b90b787e 100644
--- a/src/core/client/ui/components/ValidationMessage/ValidationMessage.css
+++ b/src/core/client/ui/components/ValidationMessage/ValidationMessage.css
@@ -12,6 +12,7 @@
   background-color: transparent;
   border: none;
   color: var(--palette-common-black);
+  padding-left: 40px;
 }
 
 .colorError {
diff --git a/src/core/client/ui/components/ValidationMessage/ValidationMessage.mdx b/src/core/client/ui/components/ValidationMessage/ValidationMessage.mdx
index 0fb2e9936..76a82362e 100644
--- a/src/core/client/ui/components/ValidationMessage/ValidationMessage.mdx
+++ b/src/core/client/ui/components/ValidationMessage/ValidationMessage.mdx
@@ -3,10 +3,12 @@ name: ValidationMessage
 menu: UI Kit
 ---
 
-import { Playground } from 'docz'
+import { Playground, PropsTable} from 'docz'
 import ValidationMessage from './ValidationMessage'
-import
+import Flex from '../Flex'
+
 # ValidationMessage
+<PropsTable of={ValidationMessage} />
 
 ## Basic Use
 <Playground>
@@ -14,7 +16,7 @@ import
     <ValidationMessage>Account with this email address already exists. Try another email</ValidationMessage>
     <ValidationMessage>Please enter a valid email address</ValidationMessage>
     <ValidationMessage color="error">Invalid characters. Try again</ValidationMessage>
-    <ValidationMessage color="error" fullWidth>Invalid characters. Try again</ValidationMessage>z
+    <ValidationMessage color="error" fullWidth>Account with this email address already exists. Try another email. </ValidationMessage>
   </Flex>
 </Playground>