diff --git a/web/e.cash/components/custom-link/index.js b/web/e.cash/components/custom-link/index.js
new file mode 100644
--- /dev/null
+++ b/web/e.cash/components/custom-link/index.js
@@ -0,0 +1,13 @@
+import Link from 'next/link';
+
+export const CustomLink = ({ href, children }) => {
+    return href.startsWith('https') ? (
+        <Link href={href} target="_blank" rel="noreferrer">
+            {children}
+        </Link>
+    ) : (
+        <Link href={href}>{children}</Link>
+    );
+};
+
+export default CustomLink;
diff --git a/web/e.cash/components/footer/index.js b/web/e.cash/components/footer/index.js
new file mode 100644
--- /dev/null
+++ b/web/e.cash/components/footer/index.js
@@ -0,0 +1,94 @@
+import Image from 'next/image';
+import Link from 'next/link';
+import {
+    FooterCtn,
+    LogoCtn,
+    ContentCtn,
+    NavItem,
+    SocialCtn,
+    ContactLink,
+    LinksCtn,
+    DropdownCtn,
+    Copyright,
+} from './styles.js';
+import { navitems } from '/data/navitems.js';
+import { socials } from '/data/socials.js';
+import { Container } from '/components/atoms';
+import CustomLink from '/components/custom-link';
+
+export default function Footer() {
+    const currentYear = new Date().getFullYear();
+    const copyrightSymbol = '\u00A9';
+    return (
+        <FooterCtn>
+            <Container>
+                <div>
+                    <LogoCtn>
+                        <div>
+                            <Image
+                                src="/images/ecash-logo.svg"
+                                alt="ecash logo"
+                                fill
+                            />
+                        </div>
+                    </LogoCtn>
+                    <ContentCtn>
+                        <div>
+                            <NavItem>Stay Connected</NavItem>
+                            <SocialCtn>
+                                {socials.map(social => (
+                                    <Link
+                                        href={social.link}
+                                        target="_blank"
+                                        rel="noreferrer"
+                                        key={social.name}
+                                    >
+                                        <Image
+                                            src={`/images/${social.name}.svg`}
+                                            alt={social.name}
+                                            fill
+                                        />
+                                    </Link>
+                                ))}
+                            </SocialCtn>
+                            <div>
+                                <ContactLink
+                                    href="mailto:contact@e.cash"
+                                    target="_blank"
+                                    title="Send us an email!"
+                                >
+                                    <div>contact@e.cash</div>
+                                </ContactLink>
+                            </div>
+                        </div>
+                        <LinksCtn>
+                            {navitems.map(navitem => (
+                                <div key={navitem.nav_item}>
+                                    <div>{navitem.nav_item}</div>
+                                    {navitem.dropdown_items ? (
+                                        <DropdownCtn>
+                                            {navitem.dropdown_items.map(
+                                                dropdownitem => (
+                                                    <CustomLink
+                                                        href={dropdownitem.link}
+                                                        key={dropdownitem.title}
+                                                    >
+                                                        {dropdownitem.title}
+                                                    </CustomLink>
+                                                ),
+                                            )}
+                                        </DropdownCtn>
+                                    ) : null}
+                                </div>
+                            ))}
+                        </LinksCtn>
+                    </ContentCtn>
+                    <Copyright>
+                        {copyrightSymbol}
+                        {currentYear} Bitcoin ABC. All Rights Reserved.
+                    </Copyright>
+                </div>
+            </Container>
+        </FooterCtn>
+    );
+}
diff --git a/web/e.cash/components/footer/styles.js b/web/e.cash/components/footer/styles.js
new file mode 100644
--- /dev/null
+++ b/web/e.cash/components/footer/styles.js
@@ -0,0 +1,155 @@
+import styled from 'styled-components';
+import Link from 'next/link';
+
+export const FooterCtn = styled.div`
+    width: 100%;
+    height: auto;
+    padding: 40px 40px 20px;
+    background-color: ${props => props.theme.colors.black};
+    color: #fff;
+    clip-path: polygon(
+        0 0,
+        18% 0,
+        19% 20px,
+        81% 20px,
+        82% 0,
+        100% 0,
+        100% 100%,
+        0 100%
+    );
+    margin-top: -20px;
+    ${props => props.theme.filters.grayscale};
+
+    ${props => props.theme.breakpoint.medium} {
+        padding: 40px 0 20px;
+    }
+`;
+
+export const LogoCtn = styled.div`
+    width: 100%;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
+    margin-bottom: 30px;
+    > div {
+        width: 130px;
+        height: 100px;
+        position: relative;
+
+        ${props => props.theme.breakpoint.medium} {
+            width: 100px;
+        }
+    }
+`;
+
+export const ContentCtn = styled.div`
+    display: flex;
+    justify-content: space-between;
+
+    ${props => props.theme.breakpoint.medium} {
+        flex-direction: column;
+    }
+`;
+
+export const NavItem = styled.div`
+    font-size: 14px;
+    font-weight: 500;
+    color: #fff;
+    margin-bottom: 5px;
+`;
+
+export const SocialCtn = styled.div`
+    display: flex;
+    width: 400px;
+    height: 30px;
+    margin-top: 10px;
+
+    ${props => props.theme.breakpoint.medium} {
+        width: 100%;
+        flex-wrap: wrap;
+        height: auto;
+    }
+
+    a {
+        width: 20px;
+        height: 20px;
+        position: relative;
+        margin-right: 20px;
+        transition: all ease-in-out 200ms;
+
+        :hover {
+            transform: scale(1.4);
+        }
+
+        :hover img {
+            filter: invert(32%) sepia(76%) saturate(5535%) hue-rotate(189deg)
+                brightness(93%) contrast(101%);
+        }
+
+        ${props => props.theme.breakpoint.medium} {
+            margin-bottom: 15px;
+            margin-right: 15px;
+        }
+    }
+`;
+
+export const ContactLink = styled(Link)`
+    opacity: 0.5;
+    font-size: 14px;
+    color: #fff;
+    line-height: 1.9em;
+
+    :hover {
+        opacity: 1;
+        color: var(--bluelight);
+    }
+`;
+
+export const LinksCtn = styled.div`
+    display: flex;
+
+    ${props => props.theme.breakpoint.medium} {
+        flex-direction: column;
+        margin-top: 50px;
+    }
+
+    > div {
+        padding: 0;
+        margin-left: 60px;
+        ${props => props.theme.breakpoint.medium} {
+            margin-left: 0;
+            margin-bottom: 20px;
+        }
+
+        > div:first-child {
+            font-size: 14px;
+            font-weight: 500;
+            color: #fff;
+            margin-bottom: 5px;
+        }
+    }
+`;
+
+export const DropdownCtn = styled.div`
+    display: flex;
+    flex-direction: column;
+
+    a {
+        opacity: 0.5;
+        font-size: 14px;
+        color: #fff;
+        line-height: 1.9em;
+
+        :hover {
+            opacity: 1;
+            color: ${props => props.theme.colors.primaryLight};
+        }
+    }
+`;
+
+export const Copyright = styled.div`
+    width: 100%;
+    font-size: 14px;
+    text-align: center;
+    color: #fff;
+    opacity: 0.3;
+    margin: 50px 0 0px;
+`;
diff --git a/web/e.cash/components/layout/index.js b/web/e.cash/components/layout/index.js
--- a/web/e.cash/components/layout/index.js
+++ b/web/e.cash/components/layout/index.js
@@ -1,5 +1,6 @@
 import Head from 'next/head';
 import Nav from '/components/navbar';
+import Footer from '/components/footer';
 
 const Layout = ({
     metaTitle = 'eCash | Wealth Redefined',
@@ -33,6 +34,7 @@
                 }}
             />
             <main>{children}</main>
+            <Footer />
         </>
     );
 };