diff --git a/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordHiddenTextExample.tsx b/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordHiddenTextExample.tsx
new file mode 100644
index 0000000..f1e834b
--- /dev/null
+++ b/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordHiddenTextExample.tsx
@@ -0,0 +1,7 @@
+import React from 'react';
+import { PasswordHiddenText } from "@patternfly/ai-infra-ui-components";
+
+
+export const PasswordHiddenTextExample: React.FunctionComponent = () => (
+
+);
diff --git a/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordInput.md b/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordInput.md
new file mode 100644
index 0000000..179639c
--- /dev/null
+++ b/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordInput.md
@@ -0,0 +1,29 @@
+---
+# Sidenav top-level section
+# should be the same for all markdown files
+section: AI-infra-ui-components
+# Sidenav secondary level section
+# should be the same for all markdown files
+id: PasswordInput
+# Tab (react | react-demos | html | html-demos | design-guidelines | accessibility)
+source: react
+# If you use typescript, the name of the interface to display props for
+# These are found through the sourceProps function provided in patternfly-docs.source.js
+propComponents: ['PasswordInput, PasswordHiddenText']
+---
+
+import { PasswordInput, PasswordHiddenText } from "@patternfly/ai-infra-ui-components";
+
+Note: these component document the API and enhance the [existing PasswordInput](https://github.com/opendatahub-io/odh-dashboard/blob/main/frontend/src/components/PasswordInput.tsx) component and [existing PasswordHiddenText](https://github.com/opendatahub-io/odh-dashboard/blob/main/frontend/src/components/PasswordHiddenText.tsx) components from odh-dashboard. It can be imported from [@patternfly/ai-infra-ui-components](https://www.npmjs.com/package/@patternfly/AI-infra-ui-components). Alternatively, they can be used within the odh-dashboard via the `~/components/PasswordInput` and `~/components/PasswordHiddenText` imports.
+
+### Password input example
+
+```js file="./PasswordInputExample.tsx"
+
+```
+
+### Password hidden text example
+
+```js file="./PasswordHiddenTextExample.tsx"
+
+```
diff --git a/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordInputExample.tsx b/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordInputExample.tsx
new file mode 100644
index 0000000..8815a53
--- /dev/null
+++ b/packages/module/patternfly-docs/content/examples/PasswordInput/PasswordInputExample.tsx
@@ -0,0 +1,7 @@
+import React from 'react';
+import { PasswordInput } from "@patternfly/ai-infra-ui-components";
+
+
+export const PasswordInputExample: React.FunctionComponent = () => (
+
+);
diff --git a/packages/module/src/PasswordInput/PasswordHiddenText.tsx b/packages/module/src/PasswordInput/PasswordHiddenText.tsx
new file mode 100644
index 0000000..876dc1e
--- /dev/null
+++ b/packages/module/src/PasswordInput/PasswordHiddenText.tsx
@@ -0,0 +1,43 @@
+import { Button, Flex, FlexItem, Content } from '@patternfly/react-core';
+import { EyeIcon, EyeSlashIcon } from '@patternfly/react-icons';
+import React from 'react';
+
+export type PasswordHiddenTextProps = {
+ /** Read only password text to display */
+ password: string;
+ /** Test id to pass to the view password toggle button */
+ testId: string;
+};
+
+export const PasswordHiddenText: React.FunctionComponent = ({
+ password,
+ testId
+}: PasswordHiddenTextProps) => {
+ const [isHidden, setIsHidden] = React.useState(true);
+
+ const passwordText = isHidden ? Array(password.length).fill('\u25CF').join('') : password;
+
+ return (
+
+
+ {passwordText}
+
+
+
+
+
+ );
+};
+
+export default PasswordHiddenText;
\ No newline at end of file
diff --git a/packages/module/src/PasswordInput/PasswordInput.tsx b/packages/module/src/PasswordInput/PasswordInput.tsx
new file mode 100644
index 0000000..c9ff6ea
--- /dev/null
+++ b/packages/module/src/PasswordInput/PasswordInput.tsx
@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { Button, InputGroup, TextInput, TextInputProps, InputGroupItem } from '@patternfly/react-core';
+import { EyeIcon, EyeSlashIcon } from '@patternfly/react-icons';
+
+export type PasswordInputProps = TextInputProps & {
+ /** Aria label to display on the view password toggle while the password is hidden */
+ ariaLabelShow?: string;
+ /** Aria label to display on the view password toggle while the password is visible */
+ ariaLabelHide?: string;
+};
+
+export const PasswordInput: React.FunctionComponent = ({
+ ariaLabelShow = 'Show password',
+ ariaLabelHide = 'Hide password',
+ ...props
+}: PasswordInputProps) => {
+ const [isPasswordHidden, setPasswordHidden] = React.useState(true);
+
+ return (
+
+
+
+
+
+
+
+
+ );
+};
+
+export default PasswordInput;
\ No newline at end of file
diff --git a/packages/module/src/PasswordInput/index.ts b/packages/module/src/PasswordInput/index.ts
new file mode 100644
index 0000000..86cfa07
--- /dev/null
+++ b/packages/module/src/PasswordInput/index.ts
@@ -0,0 +1,2 @@
+export * from './PasswordInput';
+export * from './PasswordHiddenText';
diff --git a/packages/module/src/index.ts b/packages/module/src/index.ts
index cd4a036..d7d3536 100644
--- a/packages/module/src/index.ts
+++ b/packages/module/src/index.ts
@@ -5,3 +5,4 @@ export * from './IndentSection';
export * from './K8sNameDescriptionField';
export * from './TruncatedText';
export * from './EmptyStateErrorMessage';
+export * from './PasswordInput'
\ No newline at end of file