diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/KcApp.css b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/KcApp.css
index e39d9a3f..99ab8cfc 100644
--- a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/KcApp.css
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/KcApp.css
@@ -70,7 +70,7 @@ a {
 
 .g-recaptcha {
     transform: scale(1.08);
-    margin-left: 10px;
+    margin-left: 17px;
 }
 
 /*
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/Template.tsx b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/Template.tsx
index a2274566..54ea62db 100644
--- a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/Template.tsx
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/Template.tsx
@@ -146,7 +146,7 @@ export default function Template(props: TemplateProps<KcContext, I18n>) {
                         <div id="kc-content-wrapper">
                             {/* App-initiated actions should not see warning messages about the need to complete the action during login. */}
                             {displayMessage && message !== undefined && (message.type !== "warning" || !isAppInitiatedAction) && (pageId === 'login.ftl') && (
-                                <div className='bg-errorBg min-h-11 p-2 text-center text-danger font-semibold'>
+                                <div className='bg-errorBg min-h-11 p-2 text-center text-errorColor font-semibold mb-3'>
                                     {message.type === "success" && <span className={getClassName("kcFeedbackSuccessIcon")}></span>}
                                     {message.type === "warning" && <span className={getClassName("kcFeedbackWarningIcon")}></span>}
                                     {message.type === "info" && <span className={getClassName("kcFeedbackInfoIcon")}></span>}
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/assets/error.svg b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/assets/error.svg
new file mode 100644
index 00000000..8d537bea
--- /dev/null
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/assets/error.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="13" height="10" viewBox="0 0 20 17">
+  <g id="Group_58307" data-name="Group 58307" transform="translate(-443 -564)">
+    <path id="Polygon_9" data-name="Polygon 9" d="M8.276,2.931a2,2,0,0,1,3.448,0l6.5,11.055A2,2,0,0,1,16.5,17H3.5a2,2,0,0,1-1.724-3.014Z" transform="translate(443 564)" fill="#c61818"/>
+    <path id="Path_155392" data-name="Path 155392" d="M1.909-7.545,1.822-2.633H.889L.8-7.545ZM1.357.258a.655.655,0,0,1-.478-.2.635.635,0,0,1-.2-.476.631.631,0,0,1,.2-.473.655.655,0,0,1,.478-.2.647.647,0,0,1,.471.2.654.654,0,0,1,.2.473.666.666,0,0,1-.1.338L1.8.083,1.691.167A.636.636,0,0,1,1.357.258Z" transform="translate(451.643 577.982)" fill="#fff" stroke="#fff" stroke-width="0.5"/>
+  </g>
+</svg>
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/i18n.ts b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/i18n.ts
index ca2c4c11..d9d7c957 100644
--- a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/i18n.ts
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/i18n.ts
@@ -36,7 +36,9 @@ export const { useI18n } = createUseI18n({
         requiredFields: "All fields are required, except ones marked as optional",
         missingPartnerTypeMessage: "Please specify partner type",
         logInErrorMsg: "Entered Email Address or Password invalid!",
-        registerErrorMsg: "Please fill all the required fields"
+        registerErrorMsg: "Please fill all the required fields",
+        passwordInfo: "Use 8 or more characters with at least one upper and lower case alphabet, atleast one special character.",
+        inputErrorMsg: "Please enter"
     },
     fr: {
         /* spell-checker: disable */
@@ -69,7 +71,9 @@ export const { useI18n } = createUseI18n({
         requiredFields: "All fields are required, except ones marked as optional",
         missingPartnerTypeMessage:"Please specify partner type",
         logInErrorMsg: "Entered Email Address or Password invalid!",
-        registerErrorMsg: "Please fill all the required fields"
+        registerErrorMsg: "Please fill all the required fields",
+        passwordInfo: "Use 8 or more characters with at least one upper and lower case alphabet, atleast one special character.",
+        inputErrorMsg: "Please enter"
         /* spell-checker: enable */
     }
 });
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/kcContext.ts b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/kcContext.ts
index 6d4e4d03..9f8646fc 100644
--- a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/kcContext.ts
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/kcContext.ts
@@ -18,6 +18,8 @@ export type KcContextExtension =
 				orgName?: string;
 				address?: string;
 				phoneNumber?: string;
+				password?:string;
+				'password-confirm'?:string;
 			};
 		};
 	};
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Login.tsx b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Login.tsx
index 0a773525..4c96a3ac 100644
--- a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Login.tsx
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Login.tsx
@@ -5,8 +5,9 @@ import type { PageProps } from "keycloakify/login/pages/PageProps";
 import { useGetClassName } from "keycloakify/login/lib/useGetClassName";
 import type { KcContext } from "../kcContext";
 import type { I18n } from "../i18n";
-import eyeIcon from '../assets/visibility_FILL0_wght400_GRAD0_opsz48.svg'
-import info from '../assets/info.svg'
+import eyeIcon from '../assets/visibility_FILL0_wght400_GRAD0_opsz48.svg';
+import info from '../assets/info.svg';
+import ToolTip from "./shared/Tooltip";
 
 const my_custom_param = new URL(window.location.href).searchParams.get("my_custom_param");
 
@@ -30,11 +31,9 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
 
     const onSubmit = useConstCallback<FormEventHandler<HTMLFormElement>>(e => {
         e.preventDefault();
-
         setIsLoginButtonDisabled(true);
 
         const formElement = e.target as HTMLFormElement;
-
         //NOTE: Even if we login with email Keycloak expect username and password in
         //the POST request.
         formElement.querySelector("input[name='email']")?.setAttribute("name", "username");
@@ -102,7 +101,7 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                                                     <input
                                                         tabIndex={1}
                                                         id={autoCompleteHelper}
-                                                        className={(getClassName("kcInputClass"), 'border-none outline-none')}
+                                                        className={(getClassName("kcInputClass"), 'border-none w-full outline-none')}
                                                         //NOTE: This is used by Google Chrome auto fill so we use it to tell
                                                         //the browser how to pre fill the form but before submit we put it back
                                                         //to username because it is what keycloak expects.
@@ -119,9 +118,12 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                                     })()}
                             </div>
                             <div className={getClassName("kcFormGroupClass")}>
-                                <label htmlFor="password" className={(getClassName("kcLabelClass"), 'text-hTextColor text-xl flex flex-row')}>
+                                <label htmlFor="password" className={(getClassName("kcLabelClass"), 'text-hTextColor text-xl flex flex-row items-center')}>
                                     <span>{msg("password")} </span>
-                                    <img className="ml-2 cursor-pointer" alt="info" src={info} />
+                                    <ToolTip tooltip={msgStr('passwordInfo')}>
+                                        <img className="ml-2 cursor-pointer" alt="info" src={info} />
+                                    </ToolTip>
+                                    
                                 </label>
                                 <div className="flex flex-row justify-between items-center border border-bColor border-solid rounded-lg h-14 p-2">
                                     <input
@@ -157,7 +159,7 @@ export default function Login(props: PageProps<Extract<KcContext, { pageId: "log
                                         </div>
                                     )}
                                 </div>
-                                <div className={(getClassName("kcFormOptionsWrapperClass"), 'text-hLinkColor font-semibold text-right')}>
+                                <div className={(getClassName("kcFormOptionsWrapperClass"), 'text-hLinkColor font-bold text-right')}>
                                     {realm.resetPasswordAllowed && (
                                         <span>
                                             <a tabIndex={5} href={url.loginResetCredentialsUrl}>
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Register.tsx b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Register.tsx
index 883f6b44..d4b46567 100644
--- a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Register.tsx
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/Register.tsx
@@ -8,6 +8,9 @@ import type { I18n } from "../i18n";
 import Recaptcha from 'react-recaptcha';
 import arrow from '../assets/expand_more_FILL0_wght300_GRAD0_opsz24 (1).svg';
 import eyeIcon from '../assets/visibility_FILL0_wght400_GRAD0_opsz48.svg';
+import info from '../assets/info.svg';
+import error from '../assets/error.svg'
+import ToolTip from "./shared/Tooltip";
 
 declare global {
     interface Window {
@@ -30,13 +33,14 @@ declare global {
 
 export default function Register(props: PageProps<Extract<KcContext, { pageId: "register.ftl" }>, I18n>) {
     const { kcContext, i18n, doUseDefaultCss, Template, classes } = props;
-    const { url, messagesPerField, register, realm, passwordRequired, recaptchaRequired, recaptchaSiteKey} = kcContext;
+    const { url, messagesPerField, register, realm, passwordRequired, recaptchaRequired, recaptchaSiteKey, message } = kcContext;
 
     const [passwordType, setPasswordType] = useState('password');
     const [confPasswordType, setConfPasswordType] = useState('password');
     const [orgDropdown, showOrgDropdown] = useState(false);
     const [partnerTypeValue, setPartnerType] = useState(register.formData.partnerType ?? '');
     const [orgValue, setOrgValue] = useState(register.formData.orgName ?? '');
+    const [dummyFormData, addFormDataValue] = useState(register.formData)
 
     const { getClassName } = useGetClassName({
         doUseDefaultCss,
@@ -98,11 +102,19 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
     }
 
     const selectOrgName = (val: any) => {
-        console.log(val + '>>>>>>>>>>>>>>>')
         setOrgValue(val)
         showOrgDropdown(false)
     }
 
+    const handleFormData = (event: any) => {
+        console.log("Hell")
+        const { name, value } = event.target;
+        addFormDataValue(prevState =>({
+            ...prevState,
+            [name]:value
+        }))
+    }
+    console.log(dummyFormData)
     const { msg, msgStr } = i18n;
     return (
         <Template {...{ kcContext, i18n, doUseDefaultCss, classes }} headerNode={
@@ -127,11 +139,12 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                     <div className={getClassName('kcInputWrapperClass')}>
                         <select
                             id="partnerType"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.partnerType) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full'))}
                             name="partnerType"
-                            onChange={event =>
+                            onChange={event => {
                                 selectedFormValue(event)
-                            }
+                                handleFormData(event)
+                            }}
                             value={partnerTypeValue}>
                             <option value="" selected disabled hidden>{msg("selectAnOption")}</option>
                             <option value="Device Provider">Device Provider</option>
@@ -141,6 +154,7 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                             <option value="ABIS Partner">ABIS Partner</option>
                             <option value="SDK Partner">SDK Partner</option>
                         </select>
+                        {(message && !dummyFormData.partnerType) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("partnerType")}</span></span>}
                     </div>
                 </div>
                 <div
@@ -158,11 +172,13 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                         <input
                             type="text"
                             id="firstName"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.firstName) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                             name="firstName"
                             placeholder={msgStr("firstNamePH")}
+                            onBlur={handleFormData}
                             defaultValue={register.formData.firstName ?? ""}
                         />
+                        {(message && !dummyFormData.firstName) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("firstName")}</span></span>}
                     </div>
                 </div>
 
@@ -181,11 +197,13 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                         <input
                             type="text"
                             id="lastName"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.partnerType) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                             name="lastName"
                             placeholder={msgStr("lastNamePH")}
+                            onBlur={handleFormData}
                             defaultValue={register.formData.lastName ?? ""}
                         />
+                        {(message && !dummyFormData.lastName) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("lastName")}</span></span>}
                     </div>
                 </div>
 
@@ -204,22 +222,24 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                         <input
                             type="text"
                             id="orgName"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.orgName) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                             name="orgName"
                             placeholder={msgStr("orgnamePH")}
                             defaultValue={orgValue}
                             autoComplete="off"
+                            onBlur={handleFormData}
                             onClick={displayOrgDropdown}
                         />
                         {orgDropdown && (
-                                <div className="absolute w-orgDropdownW z-10 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" >
-                                    <ul className="py-1 text-2xl text-gray-700" role="none" >
-                                        <li onClick={() => selectOrgName('organisation 1')} className="block px-4 py-2 cursor-pointer" role="menuitem" id="menu-item-1">organisation 1</li>
-                                        <li onClick={() => selectOrgName('organisation 2')} className="block px-4 py-2 cursor-pointer" role="menuitem" id="menu-item-2">organisation 2</li>
-                                        <li onClick={() => selectOrgName('organisation 3')} className="block px-4 py-2 cursor-pointer" role="menuitem" id="menu-item-0">organisation 3</li>
-                                    </ul>
-                                </div>
+                            <div className="absolute w-orgDropdownW z-10 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" >
+                                <ul className="py-1 text-2xl text-gray-700" role="none" >
+                                    <li onClick={() => selectOrgName('organisation 1')} className="block px-4 py-2 cursor-pointer" role="menuitem" id="menu-item-1">organisation 1</li>
+                                    <li onClick={() => selectOrgName('organisation 2')} className="block px-4 py-2 cursor-pointer" role="menuitem" id="menu-item-2">organisation 2</li>
+                                    <li onClick={() => selectOrgName('organisation 3')} className="block px-4 py-2 cursor-pointer" role="menuitem" id="menu-item-0">organisation 3</li>
+                                </ul>
+                            </div>
                         )}
+                        {(message && !dummyFormData.orgName) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("orgName")}</span></span>}
                     </div>
                 </div>
 
@@ -238,11 +258,13 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                         <input
                             type="text"
                             id="address"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.address) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                             name="address"
                             placeholder={msgStr("addressPH")}
+                            onBlur={handleFormData}
                             defaultValue={register.formData.address ?? ""}
                         />
+                        {(message && !dummyFormData.address) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("address")}</span></span>}
                     </div>
                 </div>
 
@@ -261,12 +283,14 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                         <input
                             type="text"
                             id="email"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.address) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                             name="email"
                             placeholder={msgStr("emailPH")}
+                            onBlur={handleFormData}
                             defaultValue={register.formData.email ?? ""}
                             autoComplete="email"
                         />
+                        {(message && !dummyFormData.email) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("email")}</span></span>}
                     </div>
                 </div>
 
@@ -285,11 +309,13 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                         <input
                             type="text"
                             id="phoneNumber"
-                            className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                            className={(getClassName("kcInputClass"), ((message && !dummyFormData.phoneNumber) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                             name="phoneNumber"
                             placeholder={msgStr("phoneNumberPH")}
+                            onBlur={handleFormData}
                             defaultValue={register.formData.phoneNumber ?? ""}
                         />
+                        {(message && !dummyFormData.phoneNumber) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("phoneNumber")}</span></span>}
                     </div>
                 </div>
                 {!realm.registrationEmailAsUsername && (
@@ -308,12 +334,14 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                             <input
                                 type="text"
                                 id="username"
-                                className={(getClassName("kcInputClass"), 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2')}
+                                className={(getClassName("kcInputClass"), ((message && !dummyFormData.username) ? 'shadow-errorShadow outline-none border border-[#C61818] border-solid h-14 rounded-lg w-full p-2' : 'outline-none border border-bColor border-solid h-14 rounded-lg w-full p-2'))}
                                 name="username"
                                 placeholder={msgStr("userNamePH")}
+                                onBlur={handleFormData}
                                 defaultValue={register.formData.username ?? ""}
                                 autoComplete="username"
                             />
+                            {(message && !dummyFormData.username) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("username")}</span></span>}
                         </div>
                     </div>
                 )}
@@ -326,22 +354,29 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                             )}
                         >
                             <div className={getClassName("kcLabelWrapperClass")}>
-                                <label htmlFor="password" className={getClassName("kcLabelClass")}>
+                                <label htmlFor="password" className={(getClassName("kcLabelClass"), 'text-hTextColor text-xl flex flex-row items-center')}>
                                     {msg("password")}
+                                    <ToolTip tooltip={msgStr('passwordInfo')}>
+                                        {/* <button className="bg-gray-900 text-white p-3 rounded"> */}
+                                        <img className="ml-2 cursor-pointer" alt="info" src={info} />
+                                        {/* </button> */}
+                                    </ToolTip>
                                 </label>
                             </div>
                             <div className={getClassName("kcInputWrapperClass")}>
-                                <div className='flex flex-row justify-between items-center border border-bColor border-solid rounded-lg h-14 p-2'>
+                                <div className={ ( message && !dummyFormData.password) ? 'shadow-errorShadow border border-[#C61818] flex flex-row justify-between items-center border-solid rounded-lg h-14 p-2' : 'flex flex-row justify-between items-center border border-bColor border-solid rounded-lg h-14 p-2'}>
                                     <input
                                         type={passwordType}
                                         id="password"
                                         className={(getClassName("kcInputClass"), 'border-none w-11/12 outline-none')}
                                         name="password"
                                         placeholder={msgStr("passwordPlaceholder")}
+                                        onBlur={handleFormData}
                                         autoComplete="new-password"
                                     />
                                     <img className="cursor-pointer" onClick={showPassword} alt="" src={eyeIcon} />
                                 </div>
+                                {(message && !dummyFormData.password) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("password")}</span></span>}
                             </div>
                         </div>
 
@@ -357,15 +392,17 @@ export default function Register(props: PageProps<Extract<KcContext, { pageId: "
                                 </label>
                             </div>
                             <div className={getClassName("kcInputWrapperClass")}>
-                                <div className='flex flex-row justify-between items-center border border-bColor border-solid rounded-lg h-14 p-2'>
+                                <div className={(message && !dummyFormData["password-confirm"]) ? 'shadow-errorShadow border border-[#C61818] flex flex-row justify-between items-center border-solid rounded-lg h-14 p-2' : 'flex flex-row justify-between items-center border border-bColor border-solid rounded-lg h-14 p-2'}>
                                     <input type={confPasswordType}
                                         id="password-confirm"
                                         className={(getClassName("kcInputClass"), 'border-none w-11/12 outline-none')}
                                         name="password-confirm"
+                                        onBlur={handleFormData}
                                         placeholder={msgStr("passwordPlaceholder")}
                                     />
                                     <img className="cursor-pointer" onClick={showConfPassword} alt="" src={eyeIcon} />
                                 </div>
+                                {(message && !dummyFormData["password-confirm"]) && <span className="text-[#C61818] mb-0 font-bold flex items-center"><img className="inline" alt='' src={error} />&nbsp;<span>{msg('inputErrorMsg')} {msg("passwordConfirm")}</span></span>}
                             </div>
                         </div>
                     </>
diff --git a/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/shared/Tooltip.tsx b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/shared/Tooltip.tsx
new file mode 100644
index 00000000..1778f318
--- /dev/null
+++ b/keycloak-artemis/mosip_keycloak_theme/src/keycloak-theme/login/pages/shared/Tooltip.tsx
@@ -0,0 +1,41 @@
+import { FC, ReactNode } from "react";
+
+interface Props {
+    children: ReactNode;
+    tooltip?: string;
+}
+
+const ToolTip: FC<Props> = ({ children, tooltip }): JSX.Element => {
+    //   const tooltipRef = useRef<HTMLSpanElement>(null);
+    //   const container = useRef<HTMLDivElement>(null);
+
+    return (
+        <div
+            //   ref={container}
+            //   onMouseEnter={({ clientX }) => {
+            //     if (!tooltipRef.current || !container.current) return;
+            //     const { left } = container.current.getBoundingClientRect();
+
+            //     tooltipRef.current.style.left = clientX - left + "px";
+            //   }}
+            className="group relative inline-block"
+        >
+            {children}
+            {tooltip ? (
+                <>
+                    <span
+                        className="invisible group-hover:visible opacity-0 group-hover:opacity-100 transition bg-white text-gray shadow-lg border p-2 rounded absolute top-1/2 -translate-y-1/2 left-[calc(100%+5px)] border-gray-300 ml-4 z-50 w-80 text-lg"
+                    >
+                        {tooltip}
+                        <div className="invisible group-hover:visible absolute h-[9px] w-[9px] border border-gray-300 -translate-x-1/2 rotate-45 bg-white border-r-0 border-t-0 -left-[.8px] content-none top-1/2">
+
+                        </div>
+                    </span>
+
+                </>
+            ) : null}
+        </div>
+    );
+};
+
+export default ToolTip;
\ No newline at end of file
diff --git a/keycloak-artemis/mosip_keycloak_theme/tailwind.config.js b/keycloak-artemis/mosip_keycloak_theme/tailwind.config.js
index b6039875..8ec5e9fd 100644
--- a/keycloak-artemis/mosip_keycloak_theme/tailwind.config.js
+++ b/keycloak-artemis/mosip_keycloak_theme/tailwind.config.js
@@ -9,11 +9,15 @@ export default {
         'hTextColor': '#031640',
         'hLinkColor': '#0D3077',
         'bColor': '#707070',
-        'errorBg': "#FFE0E0"
+        'errorBg': "#FFE0E0",
+        'errorColor': '#E21D1D'
       },
       width:{
         'orgDropdownW': '89%'
-      }
+      },
+      boxShadow: {
+        errorShadow: '0px 3px 6px rgba(255, 0, 0, 0.15)',
+      },
     }
   },
   plugins: [],