diff --git a/web-ui/web-react/src/App.js b/web-ui/web-react/src/App.js
index c605f85d..22936c88 100644
--- a/web-ui/web-react/src/App.js
+++ b/web-ui/web-react/src/App.js
@@ -28,6 +28,7 @@ import TreeDemo from './components/TreeDemo';
 import InvalidStateDemo from './components/InvalidStateDemo';
 import BlocksDemo from './components/BlocksDemo';
 import IconsDemo from './components/IconsDemo';
+import FormAdminSistema from './components/FormAdminSistema';
 
 import Crud from './pages/Crud';
 import EmptyPage from './pages/EmptyPage';
@@ -159,9 +160,10 @@ const App = () => {
     const menu = [
         {
             label: 'Home',
-            items: [{
-                label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/'
-            }]
+            items: [
+                {label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/'},
+                {label: 'Registro admin sistema', icon: 'pi pi-fw pi-id-card', to: '/formAdminSistema'}
+            ]
         },
         {
             label: 'UI Components', icon: 'pi pi-fw pi-sitemap',
@@ -320,6 +322,7 @@ const App = () => {
                     <Route path="/crud" component={Crud} />
                     <Route path="/empty" component={EmptyPage} />
                     <Route path="/documentation" component={Documentation} />
+                    <Route path="/formAdminSistema" component={FormAdminSistema} />
                 </div>
 
                 <AppFooter layoutColorMode={layoutColorMode} />
diff --git a/web-ui/web-react/src/components/FormAdminSistema.js b/web-ui/web-react/src/components/FormAdminSistema.js
new file mode 100644
index 00000000..c112cbe9
--- /dev/null
+++ b/web-ui/web-react/src/components/FormAdminSistema.js
@@ -0,0 +1,79 @@
+import React, { useState } from 'react';
+import { InputText } from 'primereact/inputtext';
+import { Button } from 'primereact/button';
+
+const FormAdminSistema = () => {
+
+    function registrarAdmin() {
+        var data = {
+            dni: "12687",
+            name: "hola",
+            last_name: "buuu",
+            email: "tmora4c@ucenfotec.ac.cr",
+            phone: 84664515,
+            password: "1203",
+            user_type: "1",
+            status: "2"
+        };
+        console.log(data);
+         fetch('http://localhost:4000/user/createAdminSystem/', {
+            cache: 'no-cache',
+            method: 'POST',
+            body: JSON.stringify(data),
+            headers: {
+                'Content-Type': 'application/json'
+            }
+        })
+        .then(
+            function (response) {
+                if (response.status != 200)
+                    console.log('Ocurrió un error con el servicio: ' + response.status);
+                else
+                    return response.json();
+            }
+        )
+        .then(
+            function (response) {
+                console.log(response);
+            }
+        )
+        .catch(
+            err => console.log('Ocurrió un error con el fetch', err)
+        );
+    }
+
+    return (
+        <div className="grid">
+            <div className="col-12">
+                <div className="card">
+                    <h5>Registro de un administrador del sistema</h5>
+                    <div className="p-fluid formgrid grid">
+                        <div className="field col-12 md:col-6">
+                            <label htmlFor="nombre">Nombre</label>
+                            <InputText id="nombre" type="text" />
+                        </div>
+                        <div className="field col-12 md:col-6">
+                            <label htmlFor="apellidos">Apellidos</label>
+                            <InputText id="apellidos" type="text" />
+                        </div>
+                        <div className="field col-12 md:col-6">
+                            <label htmlFor="correo_electronico">Correo electrónico</label>
+                            <InputText id="correo_electronico" type="text" />
+                        </div>
+                        <div className="field col-12 md:col-6">
+                            <label htmlFor="identificacion">Identificación</label>
+                            <InputText id="identificacion" type="text" />
+                        </div>
+                        <div className="field col-12">
+                            <label htmlFor="telefono">Teléfono</label>
+                            <InputText id="telefono" type="text" rows="4" />
+                        </div>
+                        <Button label="Registrar" onClick={registrarAdmin}></Button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default React.memo(FormAdminSistema);