diff --git a/docusaurus.config.js b/docusaurus.config.js
index 4a499d45..043517d0 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -42,7 +42,7 @@ async function demoLoaderPlugin() {
 /** @type {import('@docusaurus/types').Config} */
 const config = {
   title: 'ImageJS',
-  tagline: 'Dinosaurs are cool',
+  tagline: 'Advanced image processing and manipulation in JavaScript.',
   favicon: 'img/favicon.ico',
 
   // Set the production url of your site here
@@ -125,7 +125,7 @@ const config = {
           {
             href: 'https://image-js.github.io/image-js-typescript/',
             label: 'API reference',
-            position: 'right',
+            position: 'left',
           },
         ],
       },
@@ -136,25 +136,33 @@ const config = {
             title: 'Docs',
             items: [
               {
-                label: 'Tutorial',
+                label: 'Getting started',
                 to: '/docs/Getting started',
               },
+              {
+                label: 'Basics',
+                to: '/docs/Basics',
+              },
+              {
+                label: 'Features',
+                to: '/docs/Features',
+              },
             ],
           },
           {
-            title: 'Community',
+            title: 'Learn',
             items: [
               {
-                label: 'Stack Overflow',
-                href: 'https://stackoverflow.com/questions/tagged/docusaurus',
+                label: 'Tutorials',
+                to: '/docs/Tutorials',
               },
               {
-                label: 'Discord',
-                href: 'https://discordapp.com/invite/docusaurus',
+                label: 'Useful tips',
+                to: '/docs/Useful tips',
               },
               {
-                label: 'Twitter',
-                href: 'https://twitter.com/docusaurus',
+                label: 'Glossary',
+                to: '/docs/Glossary',
               },
             ],
           },
@@ -163,12 +171,19 @@ const config = {
             items: [
               {
                 label: 'GitHub',
-                href: 'https://github.com/facebook/docusaurus',
+                href: 'https://github.com/image-js/image-js-typescript',
+              },
+              {
+                label: 'API reference',
+                href: 'https://image-js.github.io/image-js-typescript/',
+              },
+              {
+                label: 'Zakodium',
+                href: 'https://www.zakodium.com/',
               },
             ],
           },
         ],
-        copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
       },
       prism: {
         theme: lightCodeTheme,
diff --git a/src/components/HomepageFeatures/index.tsx b/src/components/HomepageFeatures/index.tsx
deleted file mode 100644
index 9cf884bb..00000000
--- a/src/components/HomepageFeatures/index.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import MountainIcon from '@site/static/img/undraw_docusaurus_mountain.svg';
-import ReactIcon from '@site/static/img/undraw_docusaurus_react.svg';
-import TreeIcon from '@site/static/img/undraw_docusaurus_tree.svg';
-import clsx from 'clsx';
-import React, { ComponentProps, ComponentType } from 'react';
-
-import styles from './styles.module.css';
-
-type FeatureItem = {
-  title: string;
-  Svg: ComponentType<ComponentProps<'svg'>>;
-  description: JSX.Element;
-};
-
-const FeatureList: FeatureItem[] = [
-  {
-    title: 'Easy to Use',
-    Svg: MountainIcon,
-    description: (
-      <>
-        Docusaurus was designed from the ground up to be easily installed and
-        used to get your website up and running quickly.
-      </>
-    ),
-  },
-  {
-    title: 'Focus on What Matters',
-    Svg: TreeIcon,
-    description: (
-      <>
-        Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
-        ahead and move your docs into the <code>docs</code> directory.
-      </>
-    ),
-  },
-  {
-    title: 'Powered by React',
-    Svg: ReactIcon,
-    description: (
-      <>
-        Extend or customize your website layout by reusing React. Docusaurus can
-        be extended while reusing the same header and footer.
-      </>
-    ),
-  },
-];
-
-function Feature({ title, Svg, description }: FeatureItem) {
-  return (
-    <div className={clsx('col col--4')}>
-      <div className="text--center">
-        <Svg className={styles.featureSvg} role="img" />
-      </div>
-      <div className="text--center padding-horiz--md">
-        <h3>{title}</h3>
-        <p>{description}</p>
-      </div>
-    </div>
-  );
-}
-
-export default function HomepageFeatures(): JSX.Element {
-  return (
-    <section className={styles.features}>
-      <div className="container">
-        <div className="row">
-          {FeatureList.map((props, idx) => (
-            // eslint-disable-next-line react/no-array-index-key
-            <Feature key={idx} {...props} />
-          ))}
-        </div>
-      </div>
-    </section>
-  );
-}
diff --git a/src/components/HomepageFeatures/styles.module.css b/src/components/HomepageFeatures/styles.module.css
deleted file mode 100644
index b248eb2e..00000000
--- a/src/components/HomepageFeatures/styles.module.css
+++ /dev/null
@@ -1,11 +0,0 @@
-.features {
-  display: flex;
-  align-items: center;
-  padding: 2rem 0;
-  width: 100%;
-}
-
-.featureSvg {
-  height: 200px;
-  width: 200px;
-}
diff --git a/src/css/custom.css b/src/css/custom.css
index c5228bbe..d0e051d6 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -28,6 +28,19 @@
   --ifm-color-primary-lightest: #4fddbf;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
 }
+#frontPage {
+  width: 100%;
+  height: 100%;
+}
+.frontPage__text {
+  margin: auto;
+  max-width: 45%;
+  padding: 1em;
+}
+
+.main-wrapper {
+  flex: 1 0 0;
+}
 
 button {
   background: none;
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index 9f71a5da..7d3fbfb1 100644
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -18,6 +18,8 @@
 
 .buttons {
   display: flex;
+  flex-direction: column;
   align-items: center;
   justify-content: center;
+  gap: 10px;
 }
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index d5c586ac..efa68f5a 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,6 +1,5 @@
 import Link from '@docusaurus/Link';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-import HomepageFeatures from '@site/src/components/HomepageFeatures';
 import Layout from '@theme/Layout';
 import clsx from 'clsx';
 import React from 'react';
@@ -10,16 +9,27 @@ import styles from './index.module.css';
 function HomepageHeader() {
   const { siteConfig } = useDocusaurusContext();
   return (
-    <header className={clsx('hero hero--primary', styles.heroBanner)}>
+    <header
+      id="frontPage"
+      className={clsx('hero hero--primary', styles.heroBanner)}
+    >
       <div className="container">
         <h1 className="hero__title">{siteConfig.title}</h1>
         <p className="hero__subtitle">{siteConfig.tagline}</p>
+        <p className="frontPage__text">
+          ImageJS is a JavaScript library designed to facilitate image
+          processing and manipulation. It provides a wide range of features for
+          developers to enhance, analyze, and transform images seamlessly. It
+          includes functions for common tasks such as resizing, cropping,
+          filtering, and color adjustments.
+        </p>
+
         <div className={styles.buttons}>
           <Link
             className="button button--secondary button--lg"
-            to="/docs/Getting started"
+            to="docs/Getting started"
           >
-            Docusaurus Tutorial - 5min ⏱️
+            Let&apos;s get started
           </Link>
         </div>
       </div>
@@ -31,12 +41,11 @@ export default function Home(): JSX.Element {
   const { siteConfig } = useDocusaurusContext();
   return (
     <Layout
-      title={`Hello from ${siteConfig.title}`}
+      title={`Welcome to ${siteConfig.title}`}
       description="Description will go into a meta tag in <head />"
     >
-      <HomepageHeader />
-      <main>
-        <HomepageFeatures />
+      <main className="main-wrapper">
+        <HomepageHeader />
       </main>
     </Layout>
   );