diff --git a/packages/app/src/app/pages/Dashboard/Content/routes/Home/index.tsx b/packages/app/src/app/pages/Dashboard/Content/routes/Home/index.tsx
index ca127b53e7c..d8a0f815b51 100644
--- a/packages/app/src/app/pages/Dashboard/Content/routes/Home/index.tsx
+++ b/packages/app/src/app/pages/Dashboard/Content/routes/Home/index.tsx
@@ -2,7 +2,10 @@ import React, { useEffect } from 'react';
import { useAppState, useActions } from 'app/overmind';
import { sandboxesTypes } from 'app/overmind/namespaces/dashboard/types';
import { Header } from 'app/pages/Dashboard/Components/Header';
-import { VariableGrid } from 'app/pages/Dashboard/Components/VariableGrid';
+import {
+ VariableGrid,
+ GUTTER,
+} from 'app/pages/Dashboard/Components/VariableGrid';
import { SelectionProvider } from 'app/pages/Dashboard/Components/Selection';
import { dashboard as dashboardUrls } from '@codesandbox/common/lib/utils/url-generator';
import { Helmet } from 'react-helmet';
@@ -11,6 +14,19 @@ import {
DashboardTemplate,
PageTypes,
} from 'app/pages/Dashboard/types';
+import styled from 'styled-components';
+
+const BannerProjects = styled.a`
+ display: block;
+
+ width: calc(100% - ${2 * GUTTER}px);
+ max-width: GRID_MAX_WIDTH - 2 * GUTTER;
+ margin: 0 auto ${GUTTER}px;
+
+ img {
+ width: 100%;
+ }
+`;
export const Home = () => {
const {
@@ -84,6 +100,12 @@ export const Home = () => {
Dashboard - CodeSandbox
+
+
+
diff --git a/packages/app/static/img/projects-banner.png b/packages/app/static/img/projects-banner.png
new file mode 100644
index 00000000000..54bc3eecaf3
Binary files /dev/null and b/packages/app/static/img/projects-banner.png differ