diff --git a/frontend/src/pages/landing/Header.jsx b/frontend/src/pages/landing/Header.jsx
index 17a8dbce..33e42eee 100644
--- a/frontend/src/pages/landing/Header.jsx
+++ b/frontend/src/pages/landing/Header.jsx
@@ -1,14 +1,9 @@
 import { Link } from 'react-router-dom';
-import {
-  Container,
-  Navbar,
-  Image,
-  Nav,
-  Button,
-  Row,
-  Col,
-} from 'react-bootstrap';
+import { Container, Navbar, Image, Nav, Button } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
+import { useTernaryDarkMode } from 'usehooks-ts';
+import LanguageSelector from '../../components/Navigation/LanguageSelector.jsx';
+import ThemeSelector from '../../components/Navigation/ThemeSelector.jsx';
 import routes from '../../routes.js';
 
 import RunItLogoLight from './assets/LogoHeaderLightTheme.svg';
@@ -21,120 +16,70 @@ import './custom-colors.scss';
 
 function Header() {
   const { t } = useTranslation();
+  const { ternaryDarkMode } = useTernaryDarkMode();
 
-  const theme = document.documentElement.getAttribute('data-bs-theme');
-
-  const logo = theme === 'light' ? RunItLogoLight : RunItLogoDark;
-
+  const logo = ternaryDarkMode === 'light' ? RunItLogoLight : RunItLogoDark;
   return (
     <header>
       <Navbar expand="lg">
-        <Container>
-          <Row className="justify-content-between gap-5">
-            <Col>
-              <div className="d-flex flex-nowrap justify-content-between gap-5">
-                <Navbar.Brand className="m-0">
-                  <Image fluid src={logo} />
+        <Container className="justify-content-between">
+          <Navbar.Brand className="mr-5">
+            <Image src={logo} />
+          </Navbar.Brand>
+          <Navbar.Toggle
+            aria-controls="navbar-responsive"
+            className="border-0 ms-auto"
+            data-bs-toogle="collapse"
+          >
+            <Image src={Burger} />
+          </Navbar.Toggle>
+          <Navbar.Collapse className="my-3 mb-lg-0" id="navbar-responsive">
+            <Nav as="ul" className="text-center">
+              <li>
+                <Navbar.Brand className="header-link" href="#aboutProject">
+                  <span>{t('landing.header.about')}</span>
+                </Navbar.Brand>
+              </li>
+              <li>
+                <Navbar.Brand className="header-link" href="#advantages">
+                  <span>{t('landing.header.advantages')}</span>
                 </Navbar.Brand>
-                <Navbar.Toggle
-                  aria-controls="navbar-responsive"
-                  className="border-0 ms-auto"
-                  data-bs-toogle="collapse"
-                >
-                  <Image src={Burger} />
-                </Navbar.Toggle>
-              </div>
-              <Navbar.Collapse className="my-3 mb-lg-0" id="navbar-responsive">
-                <Nav as="ul" className="gap-2 text-center d-lg-none mb-3">
-                  <li>
-                    <Navbar.Brand className="header-link" href="#aboutProject">
-                      <span>{t('landing.header.about')}</span>
-                    </Navbar.Brand>
-                  </li>
-                  <li>
-                    <Navbar.Brand className="header-link" href="#advantages">
-                      <span>{t('landing.header.advantages')}</span>
-                    </Navbar.Brand>
-                  </li>
-                  <li>
-                    <Navbar.Brand className="header-link" href="#possibilities">
-                      <span>{t('landing.header.opportunities')}</span>
-                    </Navbar.Brand>
-                  </li>
-                  <li>
-                    <Navbar.Brand className="header-link" href="#faq">
-                      <span>{t('landing.header.faq')}</span>
-                    </Navbar.Brand>
-                  </li>
-                </Nav>
-                <Nav className=" mb-3 mb-lg-0 gap-3 ms-auto d-lg-none">
-                  <Button
-                    as={Link}
-                    className="rounded-5 d-flex px-5 justify-content-center btn-signin"
-                    to={routes.signInPagePath()}
-                    variant="primary"
-                  >
-                    <span>{t('profileActions.signIn')}</span>
-                  </Button>
-                  <Button
-                    as={Link}
-                    className="rounded-5 d-flex px-5 justify-content-center btn-signup"
-                    to={routes.signUpPagePath()}
-                    variant="secondary"
-                  >
-                    <span>{t('profileActions.signUp')}</span>
-                  </Button>
-                </Nav>
-              </Navbar.Collapse>
-            </Col>
-            <Col className="mt-5 mt-lg-0 d-none d-lg-block">
-              <Nav
-                as="ul"
-                className="h-100 gap-2 text-center align-items-center"
+              </li>
+              <li>
+                <Navbar.Brand className="header-link" href="#possibilities">
+                  <span>{t('landing.header.opportunities')}</span>
+                </Navbar.Brand>
+              </li>
+              <li>
+                <Navbar.Brand className="header-link" href="#faq">
+                  <span>{t('landing.header.faq')}</span>
+                </Navbar.Brand>
+              </li>
+            </Nav>
+            <Nav
+              as="ul"
+              className="mb-3 mb-lg-0 gap-1 ms-auto align-items-center"
+            >
+              <LanguageSelector />
+              <ThemeSelector />
+              <Button
+                as={Link}
+                className="rounded-5 btn-signin"
+                to={routes.signInPagePath()}
+                variant="primary"
+              >
+                <span>{t('profileActions.signIn')}</span>
+              </Button>
+              <Button
+                as={Link}
+                className="rounded-5 btn-signup"
+                to={routes.signUpPagePath()}
+                variant="secondary"
               >
-                <li>
-                  <Navbar.Brand className="header-link" href="#aboutProject">
-                    <span>{t('landing.header.about')}</span>
-                  </Navbar.Brand>
-                </li>
-                <li>
-                  <Navbar.Brand className="header-link" href="#advantages">
-                    <span>{t('landing.header.advantages')}</span>
-                  </Navbar.Brand>
-                </li>
-                <li>
-                  <Navbar.Brand className="header-link" href="#possibilities">
-                    <span>{t('landing.header.opportunities')}</span>
-                  </Navbar.Brand>
-                </li>
-                <li>
-                  <Navbar.Brand className="header-link" href="#faq">
-                    <span>{t('landing.header.faq')}</span>
-                  </Navbar.Brand>
-                </li>
-              </Nav>
-            </Col>
-            <Col className="d-none d-lg-block">
-              <Nav className="gap-3 ms-auto h-100 align-items-center">
-                <Button
-                  as={Link}
-                  className="rounded-5 d-flex px-5 justify-content-center btn-signin"
-                  to={routes.signInPagePath()}
-                  variant="primary"
-                >
-                  <span>{t('profileActions.signIn')}</span>
-                </Button>
-                <Button
-                  as={Link}
-                  className="rounded-5 d-flex px-5 justify-content-center btn-signup"
-                  to={routes.signUpPagePath()}
-                  variant="secondary"
-                >
-                  <span>{t('profileActions.signUp')}</span>
-                </Button>
-              </Nav>
-            </Col>
-          </Row>
+                <span>{t('profileActions.signUp')}</span>
+              </Button>
+            </Nav>
+          </Navbar.Collapse>
         </Container>
       </Navbar>
     </header>
diff --git a/frontend/src/pages/landing/assets/LogoHeaderDarkTheme.svg b/frontend/src/pages/landing/assets/LogoHeaderDarkTheme.svg
index 11b9c2d1..61a7853d 100644
--- a/frontend/src/pages/landing/assets/LogoHeaderDarkTheme.svg
+++ b/frontend/src/pages/landing/assets/LogoHeaderDarkTheme.svg
@@ -1,4 +1,4 @@
-<svg width="389" height="64" viewBox="0 0 389 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="250" height="50" viewBox="0 0 389 64" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M41.2978 14.1354L28.9257 18.6395L21.5071 30.6084L14.1691 18.7778L1.71642 14.2506L16.3463 36.9903L0 62.8633H9.60735L21.2882 43.7983L33.1188 62.8633H42.7147L26.449 37.4971L41.2978 14.1354ZM53.9002 38.7873C55.2595 33.4883 59.4181 29.6177 65.5811 29.6177C71.5367 29.6177 75.6146 33.4192 76.8357 38.7873H53.9002ZM65.5926 22.5792C53.6928 22.5792 45.2375 31.3226 45.2375 43.2224C45.2375 55.1221 53.762 63.7273 65.7308 63.7273C74.1171 63.7273 81.6394 59.5687 84.7267 50.7562H76.3404C74.4742 54.6268 70.5345 56.6312 65.7999 56.6312C59.1992 56.6312 54.1191 52.6224 53.474 45.3765H85.51C86.3048 32.4055 78.2757 22.5792 65.5926 22.5792ZM129.307 23.4432H118.917L101.856 40.5037V23.4432H93.758V62.8633H101.856V44.6623L120.426 62.8633H130.886L110.035 42.151L129.307 23.4432ZM152.681 30.1131C157.772 30.1131 162.138 32.8317 163.647 37.7851H172.034C170.237 28.2469 162 22.5908 152.681 22.5908C140.931 22.5908 132.176 31.4033 132.176 43.1648C132.176 54.9148 140.919 63.7388 152.6 63.7388C161.85 63.7388 170.156 58.2209 172.022 48.4753H163.636C162.127 53.3481 157.761 56.2165 152.6 56.2165C145.504 56.2165 140.343 50.8368 140.343 43.1648C140.355 35.5618 145.377 30.1131 152.681 30.1131ZM184.302 46.8165C183.081 54.1314 181.434 56.205 177.632 56.205C176.849 56.205 176.054 56.0552 175.271 55.9861V63.301C176.561 63.5199 177.989 63.7273 179.28 63.7273C186.018 63.7273 190.396 59.2807 192.331 47.5307L194.912 31.0461H207.963V62.8748H216.062V23.4432H188.034L184.302 46.8165ZM233.191 38.7873C234.551 33.4883 238.709 29.6177 244.872 29.6177C250.816 29.6177 254.906 33.4192 256.127 38.7873H233.191ZM244.872 22.5792C232.972 22.5792 224.517 31.3226 224.517 43.2224C224.517 55.1221 233.041 63.7273 245.022 63.7273C253.408 63.7273 260.93 59.5687 264.018 50.7562H255.631C253.765 54.6268 249.826 56.6312 245.091 56.6312C238.502 56.6312 233.41 52.6224 232.765 45.3765H264.801C265.584 32.4055 257.555 22.5792 244.872 22.5792ZM290.179 23.4432H269.178V31.0461H282.08V62.8633H290.179V31.0461H303V23.4432H290.179Z" fill="#EBF1F9"/>
 <path d="M41.3665 7.85712L21.357 0.369385L1.34741 7.85712L21.357 15.149L41.3665 7.85712Z" fill="#136EF6"/>
 <path d="M307.944 46V23.44H316.456C318.867 23.44 320.701 23.9947 321.96 25.104C323.24 26.2133 323.88 27.792 323.88 29.84C323.88 31.5253 323.421 32.8907 322.504 33.936C321.587 34.9813 320.285 35.6533 318.6 35.952C319.517 36.2933 320.328 37.1253 321.032 38.448L325.128 46H322.984L319.08 38.768C318.525 37.7653 317.907 37.0933 317.224 36.752C316.541 36.4107 315.624 36.24 314.472 36.24H309.896V46H307.944ZM309.896 34.576H316.2C319.997 34.576 321.896 32.9973 321.896 29.84C321.896 26.704 319.997 25.136 316.2 25.136H309.896V34.576ZM334.188 46.256C330.498 46.256 328.652 44.2507 328.652 40.24V30.48H330.604V40.144C330.604 41.6587 330.914 42.7787 331.532 43.504C332.151 44.2293 333.122 44.592 334.444 44.592C335.874 44.592 337.036 44.112 337.932 43.152C338.85 42.192 339.308 40.912 339.308 39.312V30.48H341.26V46H339.372V43.248C338.86 44.2293 338.146 44.976 337.228 45.488C336.332 46 335.319 46.256 334.188 46.256ZM346.404 46V30.48H348.324V33.264C348.836 32.24 349.572 31.472 350.532 30.96C351.492 30.448 352.558 30.192 353.732 30.192C357.422 30.192 359.268 32.1973 359.268 36.208V46H357.316V36.368C357.316 34.832 357.006 33.7013 356.388 32.976C355.769 32.2507 354.788 31.888 353.444 31.888C351.908 31.888 350.67 32.368 349.732 33.328C348.814 34.2667 348.356 35.536 348.356 37.136V46H346.404ZM364.694 46V23.44H366.646V46H364.694ZM378.106 46V25.2H369.69V23.44H388.506V25.2H380.09V46H378.106Z" fill="#136EF6"/>
diff --git a/frontend/src/pages/landing/assets/LogoHeaderLightTheme.svg b/frontend/src/pages/landing/assets/LogoHeaderLightTheme.svg
index ef082d60..d8f210ee 100644
--- a/frontend/src/pages/landing/assets/LogoHeaderLightTheme.svg
+++ b/frontend/src/pages/landing/assets/LogoHeaderLightTheme.svg
@@ -1,4 +1,4 @@
-<svg width="389" height="64" viewBox="0 0 389 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="250" height="50" viewBox="0 0 389 64" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M41.2978 14.1354L28.9257 18.6395L21.5071 30.6084L14.1691 18.7778L1.71642 14.2506L16.3463 36.9903L0 62.8633H9.60735L21.2882 43.7983L33.1188 62.8633H42.7147L26.449 37.4971L41.2978 14.1354ZM53.9002 38.7873C55.2595 33.4883 59.4181 29.6177 65.5811 29.6177C71.5367 29.6177 75.6146 33.4192 76.8357 38.7873H53.9002ZM65.5926 22.5792C53.6928 22.5792 45.2375 31.3226 45.2375 43.2224C45.2375 55.1221 53.762 63.7273 65.7308 63.7273C74.1171 63.7273 81.6394 59.5687 84.7267 50.7562H76.3404C74.4742 54.6268 70.5345 56.6312 65.7999 56.6312C59.1992 56.6312 54.1191 52.6224 53.474 45.3765H85.51C86.3048 32.4055 78.2757 22.5792 65.5926 22.5792ZM129.307 23.4432H118.917L101.856 40.5037V23.4432H93.758V62.8633H101.856V44.6623L120.426 62.8633H130.886L110.035 42.151L129.307 23.4432ZM152.681 30.1131C157.772 30.1131 162.138 32.8317 163.647 37.7851H172.034C170.237 28.2469 162 22.5908 152.681 22.5908C140.931 22.5908 132.176 31.4033 132.176 43.1648C132.176 54.9148 140.919 63.7388 152.6 63.7388C161.85 63.7388 170.156 58.2209 172.022 48.4753H163.636C162.127 53.3481 157.761 56.2165 152.6 56.2165C145.504 56.2165 140.343 50.8368 140.343 43.1648C140.355 35.5618 145.377 30.1131 152.681 30.1131ZM184.302 46.8165C183.081 54.1314 181.434 56.205 177.632 56.205C176.849 56.205 176.054 56.0552 175.271 55.9861V63.301C176.561 63.5199 177.989 63.7273 179.28 63.7273C186.018 63.7273 190.396 59.2807 192.331 47.5307L194.912 31.0461H207.963V62.8748H216.062V23.4432H188.034L184.302 46.8165ZM233.191 38.7873C234.551 33.4883 238.709 29.6177 244.872 29.6177C250.816 29.6177 254.906 33.4192 256.127 38.7873H233.191ZM244.872 22.5792C232.972 22.5792 224.517 31.3226 224.517 43.2224C224.517 55.1221 233.041 63.7273 245.022 63.7273C253.408 63.7273 260.93 59.5687 264.018 50.7562H255.631C253.765 54.6268 249.826 56.6312 245.091 56.6312C238.502 56.6312 233.41 52.6224 232.765 45.3765H264.801C265.584 32.4055 257.555 22.5792 244.872 22.5792ZM290.179 23.4432H269.178V31.0461H282.08V62.8633H290.179V31.0461H303V23.4432H290.179Z" fill="#050914"/>
 <path d="M41.3663 7.85712L21.3567 0.369385L1.34717 7.85712L21.3567 15.149L41.3663 7.85712Z" fill="#136EF6"/>
 <path d="M307.944 46V23.44H316.456C318.867 23.44 320.701 23.9947 321.96 25.104C323.24 26.2133 323.88 27.792 323.88 29.84C323.88 31.5253 323.421 32.8907 322.504 33.936C321.587 34.9813 320.285 35.6533 318.6 35.952C319.517 36.2933 320.328 37.1253 321.032 38.448L325.128 46H322.984L319.08 38.768C318.525 37.7653 317.907 37.0933 317.224 36.752C316.541 36.4107 315.624 36.24 314.472 36.24H309.896V46H307.944ZM309.896 34.576H316.2C319.997 34.576 321.896 32.9973 321.896 29.84C321.896 26.704 319.997 25.136 316.2 25.136H309.896V34.576ZM334.188 46.256C330.498 46.256 328.652 44.2507 328.652 40.24V30.48H330.604V40.144C330.604 41.6587 330.914 42.7787 331.532 43.504C332.151 44.2293 333.122 44.592 334.444 44.592C335.874 44.592 337.036 44.112 337.932 43.152C338.85 42.192 339.308 40.912 339.308 39.312V30.48H341.26V46H339.372V43.248C338.86 44.2293 338.146 44.976 337.228 45.488C336.332 46 335.319 46.256 334.188 46.256ZM346.404 46V30.48H348.324V33.264C348.836 32.24 349.572 31.472 350.532 30.96C351.492 30.448 352.558 30.192 353.732 30.192C357.422 30.192 359.268 32.1973 359.268 36.208V46H357.316V36.368C357.316 34.832 357.006 33.7013 356.388 32.976C355.769 32.2507 354.788 31.888 353.444 31.888C351.908 31.888 350.67 32.368 349.732 33.328C348.814 34.2667 348.356 35.536 348.356 37.136V46H346.404ZM364.694 46V23.44H366.646V46H364.694ZM378.106 46V25.2H369.69V23.44H388.506V25.2H380.09V46H378.106Z" fill="#136EF6"/>