diff --git a/packages/web/src/components/projectCard.tsx b/packages/web/src/components/projectCard.tsx
index 589fadc..d64e995 100644
--- a/packages/web/src/components/projectCard.tsx
+++ b/packages/web/src/components/projectCard.tsx
@@ -18,7 +18,10 @@ const ProjectCard: FC<Props> = ({ project }) => {
 
   return (
     <NextLink href={`/${project.id}/profile`}>
-      <Card w="sm">
+      <Card
+        minW="sm"
+        w="full"
+      >
         <Flex gap="6">
           <Avatar
             name={project.name}
diff --git a/packages/web/src/pages/index.tsx b/packages/web/src/pages/index.tsx
index b7bb7a0..ecc11d1 100644
--- a/packages/web/src/pages/index.tsx
+++ b/packages/web/src/pages/index.tsx
@@ -1,7 +1,9 @@
-import { SimpleGrid } from '@chakra-ui/react'
+import { Button, Flex, SimpleGrid } from '@chakra-ui/react'
 import type { Setting } from '@prisma/client'
 import type { ProjectWithEventCount } from 'common'
 import type { GetServerSideProps, NextPage } from 'next'
+import { RiAddLine } from 'react-icons/ri'
+import NextLink from 'next/link'
 import ProjectCard from '~/components/projectCard'
 import Wrapper from '~/components/wrapper'
 import { serviceGetSetting } from '~/services/bootstrap'
@@ -38,8 +40,18 @@ export const getServerSideProps: GetServerSideProps<Props> = async() => {
 const Home: NextPage<Props> = ({ projects }) => {
   return (
     <Wrapper>
+      <Flex justify="end">
+        <NextLink href="/create-project">
+          <Button
+            leftIcon={<RiAddLine />}
+          >
+            Create a Project
+          </Button>
+        </NextLink>
+      </Flex>
       <SimpleGrid
         columns={3}
+        mt="4"
         spacing="8"
       >
         {