.

frontend/src/components/ui/landing/Landing.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Container, Box, Button, Typography } from '@mui/material';
 import { useNavigate } from 'react-router-dom';
 import { WavyBackground } from '../aceternity/WavyBackground';
+import logo from '../../../assets/img/logo1024.png';
 
 const Landing: React.FC = () => {
   const navigate = useNavigate();
@@ -13,12 +14,30 @@ const Landing: React.FC = () => {
   return (
     <WavyBackground>
       <Container component="main" sx={{ mt: 8, mb: 2 }} maxWidth="sm">
-        <Typography variant="h2" component="h1" gutterBottom align='center'>
-          Welcome
+        <Typography variant="h1" component="h1" gutterBottom align='center'>
+          Welcome to Project Alice
         </Typography>
-        <Typography variant="h5" component="h2" gutterBottom align='center'>
+
+        <Typography variant="h2" component="h2" gutterBottom align='center'>
+          The Agentic Workflows Manager
+        </Typography>
+
+        <Box sx={{ display: 'flex', justifyContent: 'center', mb: 2 }}>
+          <img src={logo} alt="Project Alice Logo" style={{ maxWidth: '250px', height: 'auto' }} />
+        </Box>
+
+        <Typography variant="h4" component="h4" gutterBottom align='center'>
+          Build, test and deploy conversational agents and complext workflows with no code
+        </Typography>
+
+        <Typography variant="h5" component="h5" gutterBottom align='center'>
           Please login or register to continue
         </Typography>
+
+        <Typography variant="body1" component="p" gutterBottom align='center'>
+          (This creates an account on the backend and initializes it with the modules available)
+        </Typography>
+
         <Box sx={{ mt: 4 }}>
           <Button
             variant="contained"
@@ -41,4 +60,4 @@ const Landing: React.FC = () => {
   );
 };
 
-export default Landing;
+export default Landing;