diff --git a/striker-ui/components/Text/HeaderText.tsx b/striker-ui/components/Text/HeaderText.tsx
index cb08cc2a..0b85b5df 100644
--- a/striker-ui/components/Text/HeaderText.tsx
+++ b/striker-ui/components/Text/HeaderText.tsx
@@ -1,13 +1,38 @@
-import Typography from '@mui/material/Typography';
-import { styled } from '@mui/material/styles';
+import { styled, Typography, TypographyProps } from '@mui/material';
+import { FC, useMemo } from 'react';
+
 import { TEXT } from '../../lib/consts/DEFAULT_THEME';
 
 const WhiteTypography = styled(Typography)({
   color: TEXT,
 });
 
-const HeaderText = ({ text }: { text: string }): JSX.Element => (
-  <WhiteTypography variant="h4">{text}</WhiteTypography>
-);
+type HeaderTextOptionalPropsWithoutDefault = {
+  text?: string;
+};
+
+type HeaderTextOptionalProps = HeaderTextOptionalPropsWithoutDefault;
+
+type HeaderTextProps = TypographyProps & HeaderTextOptionalProps;
+
+const HEADER_TEXT_DEFAULT_PROPS: HeaderTextOptionalPropsWithoutDefault = {
+  text: undefined,
+};
+
+const HeaderText: FC<HeaderTextProps> = ({
+  children,
+  text,
+  ...restHeaderTextProps
+}) => {
+  const content = useMemo(() => children ?? text, [children, text]);
+
+  return (
+    <WhiteTypography variant="h4" {...restHeaderTextProps}>
+      {content}
+    </WhiteTypography>
+  );
+};
+
+HeaderText.defaultProps = HEADER_TEXT_DEFAULT_PROPS;
 
 export default HeaderText;