diff --git a/src/views/App.js b/src/views/App.js
index 2e253db..56a75c6 100644
--- a/src/views/App.js
+++ b/src/views/App.js
@@ -1,26 +1,29 @@
-import React from 'react';
-import { Router, Route, Redirect, Switch } from 'react-router-dom';
+import React from "react";
+import { Router, Route, Redirect, Switch } from "react-router-dom";
+
+import { ThemeProvider } from "@material-ui/core/styles";
+import { CssBaseline } from "@material-ui/core";
 
-import { ThemeProvider } from '@material-ui/core/styles';
-import { CssBaseline } from '@material-ui/core';
 
 import createBrowserHistory from '../config/history';
 import Home from './Home';
 import Navbar from '../components/Navbar';
-
+import ImageAvatars from "./Contact/Contact";
 import theme from '../config/theme';
 
+
 const App = () => {
   return (
     <ThemeProvider theme={theme}>
       <CssBaseline />
+      <ImageAvatars />
       <Router history={createBrowserHistory}>
         <Navbar />
         <Switch>
           <Route path='/' exact>
             <Home />
           </Route>
-          <Redirect to='/' />
+          <Redirect to="/" />
         </Switch>
       </Router>
     </ThemeProvider>
diff --git a/src/views/Contact/Contact.js b/src/views/Contact/Contact.js
new file mode 100644
index 0000000..3a02246
--- /dev/null
+++ b/src/views/Contact/Contact.js
@@ -0,0 +1,98 @@
+import React from "react";
+import { makeStyles } from "@material-ui/core/styles";
+import Avatar from "@material-ui/core/Avatar";
+import TextField from "@material-ui/core/TextField";
+import Button from "@material-ui/core/Button";
+import Facebook from "./images/Facebook.svg";
+import Github from "./images/Github.svg";
+import Instagram from "./images/Instagram.svg";
+import Slack from "./images/Slack.png";
+
+const useStyles = makeStyles((theme) => ({
+  background: {
+    backgroundColor: "#0f3057",
+  },
+  heading1: {
+    paddingLeft: "37%",
+    paddingTop: "10%",
+  },
+  heading2: {
+    paddingLeft: "30%",
+  },
+  root: {
+    display: "flex",
+    paddingLeft: "41%",
+    paddingRight: "41%",
+    "& > *": {
+      margin: theme.spacing(2),
+    },
+  },
+  input: {
+    paddingLeft: "30%",
+    paddingRight: "30%",
+  },
+}));
+
+export default function ImageAvatars() {
+  const classes = useStyles();
+
+  return (
+    <div className={classes.background}>
+      <h1 className={classes.heading1}>Stay Connected With OpenCode</h1>
+      <div className={classes.root}>
+        <Avatar alt="F">
+          <a href="https://www.facebook.com/OpenCodeCommunity/">
+            <img width="100%" height="100%" src={Facebook} alt="F" />
+          </a>
+        </Avatar>
+        <Avatar alt="G">
+          <a href=" https://github.com/opencodenitr">
+            <img width="100%" height="100%" src={Github} alt="G" />
+          </a>
+        </Avatar>
+        <Avatar alt="I">
+          <a href="https://www.instagram.com/opencode.nitr/">
+            <img width="100%" height="100%" src={Instagram} alt="I" />
+          </a>
+        </Avatar>
+        <Avatar alt="S">
+          <a href="http://bit.ly/NITRDevs">
+            <img width="100%" height="100%" src={Slack} alt="M" />
+          </a>
+        </Avatar>
+      </div>
+      <h1 className={classes.heading2}>
+        Please provide any comments or suggestions below!
+      </h1>
+      <div className={classes.input}>
+        <TextField
+          id="outlined-textarea"
+          label="Email:"
+          placeholder="Enter you email here!"
+          multiline
+          fullWidth
+          margin="normal"
+          variant="outlined"
+        />
+        ​
+        <TextField
+          id="outlined-textarea"
+          label="Comments:"
+          placeholder="Please enter your comments here!"
+          multiline
+          fullWidth
+          margin="normal"
+          variant="outlined"
+        />
+        ​
+        <Button
+          onClick={() => alert("Thanks for the feedback")}
+          variant="contained"
+          color="secondary"
+        >
+          Submit
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/src/views/Contact/images/Facebook.svg b/src/views/Contact/images/Facebook.svg
new file mode 100644
index 0000000..69c1874
--- /dev/null
+++ b/src/views/Contact/images/Facebook.svg
@@ -0,0 +1,4 @@
+<svg id="Facebook" xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
+  <path id="Path_8" data-name="Path 8" d="M0,24A24,24,0,1,1,24,48,24,24,0,0,1,0,24Z" fill="#3b5998"/>
+  <path id="Path_9" data-name="Path 9" d="M26.5,38.111V25.054h3.6l.478-4.5H26.5l.006-2.252c0-1.174.111-1.8,1.8-1.8h2.253V12h-3.6c-4.33,0-5.854,2.183-5.854,5.854v2.7H18.4v4.5h2.7V38.111Z" fill="#fff"/>
+</svg>
diff --git a/src/views/Contact/images/Github.svg b/src/views/Contact/images/Github.svg
new file mode 100644
index 0000000..d310a63
--- /dev/null
+++ b/src/views/Contact/images/Github.svg
@@ -0,0 +1,10 @@
+<svg id="Github" xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
+  <path id="Path_10" data-name="Path 10" d="M24,0C10.747,0,0,11.017,0,24.608a24.566,24.566,0,0,0,16.413,23.35c1.2.228,1.64-.534,1.64-1.184,0-.587-.022-2.525-.033-4.581-6.677,1.489-8.086-2.9-8.086-2.9-1.092-2.844-2.665-3.6-2.665-3.6-2.178-1.527.164-1.5.164-1.5a5.06,5.06,0,0,1,3.679,2.536c2.141,3.762,5.615,2.674,6.984,2.046a5.291,5.291,0,0,1,1.524-3.291C14.29,34.861,8.686,32.751,8.686,23.322a9.658,9.658,0,0,1,2.473-6.6,9.05,9.05,0,0,1,.233-6.512s2.015-.661,6.6,2.522a22.224,22.224,0,0,1,12.02,0c4.581-3.184,6.593-2.522,6.593-2.522a9.039,9.039,0,0,1,.235,6.512,9.639,9.639,0,0,1,2.47,6.6c0,9.451-5.614,11.532-10.959,12.142a5.962,5.962,0,0,1,1.628,4.557c0,3.292-.028,5.942-.028,6.753,0,.655.432,1.422,1.649,1.181A24.563,24.563,0,0,0,48,24.608C48,11.017,37.255,0,24,0Z" fill="#161514"/>
+  <path id="Path_11" data-name="Path 11" d="M9.161,35.162c-.053.121-.24.157-.411.074s-.271-.244-.215-.366.239-.159.413-.076S9.221,35.041,9.161,35.162Z" fill="#161514"/>
+  <path id="Path_12" data-name="Path 12" d="M10.131,36.263c-.114.108-.338.058-.489-.113a.377.377,0,0,1-.07-.506c.118-.108.334-.057.491.112S10.251,36.154,10.131,36.263Z" fill="#161514"/>
+  <path id="Path_13" data-name="Path 13" d="M11.076,37.666c-.147.1-.387.006-.535-.21s-.147-.477,0-.581.385-.01.536.2S11.226,37.56,11.076,37.666Z" fill="#161514"/>
+  <path id="Path_14" data-name="Path 14" d="M12.37,39.022c-.131.147-.411.108-.616-.093a.473.473,0,0,1-.136-.623c.133-.148.414-.106.62.093S12.51,38.876,12.37,39.022Z" fill="#161514"/>
+  <path id="Path_15" data-name="Path 15" d="M14.155,39.809c-.058.191-.327.278-.6.2s-.448-.307-.394-.5.327-.282.6-.2S14.211,39.615,14.155,39.809Z" fill="#161514"/>
+  <path id="Path_16" data-name="Path 16" d="M16.115,39.955c.007.2-.223.368-.508.371s-.518-.156-.521-.354.225-.368.511-.373S16.115,39.756,16.115,39.955Z" fill="#161514"/>
+  <path id="Path_17" data-name="Path 17" d="M17.94,39.639c.034.2-.164.4-.447.451s-.535-.069-.571-.264.167-.4.445-.454S17.9,39.44,17.94,39.639Z" fill="#161514"/>
+</svg>
diff --git a/src/views/Contact/images/Instagram.svg b/src/views/Contact/images/Instagram.svg
new file mode 100644
index 0000000..9deb9f9
--- /dev/null
+++ b/src/views/Contact/images/Instagram.svg
@@ -0,0 +1,12 @@
+<svg id="Instagram" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" viewBox="0 0 48 48">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#c13db7"/>
+      <stop offset="1" stop-color="#fdda47"/>
+    </linearGradient>
+  </defs>
+  <path id="Path_27" data-name="Path 27" d="M0,24A24,24,0,1,1,24,48,24,24,0,0,1,0,24Z" fill="#fff"/>
+  <g id="Group_13" data-name="Group 13">
+    <path id="Path_28" data-name="Path 28" d="M24,11.2c-3.476,0-3.913.015-5.278.077a9.392,9.392,0,0,0-3.107.595,6.548,6.548,0,0,0-3.745,3.743,9.35,9.35,0,0,0-.595,3.107c-.061,1.365-.077,1.8-.077,5.278s.016,3.911.077,5.277a9.407,9.407,0,0,0,.595,3.107,6.55,6.55,0,0,0,3.743,3.745,9.4,9.4,0,0,0,3.107.595c1.365.062,1.8.077,5.277.077s3.912-.015,5.277-.077a9.409,9.409,0,0,0,3.108-.595,6.558,6.558,0,0,0,3.743-3.745,9.486,9.486,0,0,0,.595-3.107c.061-1.365.077-1.8.077-5.277s-.016-3.913-.077-5.278a9.482,9.482,0,0,0-.595-3.107,6.549,6.549,0,0,0-3.744-3.744,9.422,9.422,0,0,0-3.109-.595c-1.365-.062-1.8-.077-5.277-.077Zm-.427,2.307H24c3.418,0,3.823.012,5.172.074a7.088,7.088,0,0,1,2.377.441,4.242,4.242,0,0,1,2.429,2.429,7.073,7.073,0,0,1,.441,2.376c.061,1.349.075,1.755.075,5.171s-.013,3.821-.075,5.171a7.081,7.081,0,0,1-.441,2.376,4.245,4.245,0,0,1-2.429,2.428,7.06,7.06,0,0,1-2.377.441c-1.349.061-1.755.075-5.172.075s-3.823-.013-5.172-.075a7.1,7.1,0,0,1-2.377-.441,4.241,4.241,0,0,1-2.43-2.429,7.072,7.072,0,0,1-.441-2.376c-.061-1.349-.074-1.755-.074-5.173s.012-3.821.074-5.171a7.085,7.085,0,0,1,.441-2.377,4.242,4.242,0,0,1,2.43-2.43,7.072,7.072,0,0,1,2.377-.441c1.181-.053,1.638-.069,4.024-.072v0ZM29.3,17.167a1.536,1.536,0,0,1,1.536-1.535h0A1.536,1.536,0,1,1,29.3,17.167Zm-5.3.259A6.573,6.573,0,1,0,30.573,24,6.574,6.574,0,0,0,24,17.427ZM28.268,24A4.267,4.267,0,1,0,24,28.267,4.267,4.267,0,0,0,28.268,24Z" fill-rule="evenodd" fill="url(#linear-gradient)"/>
+  </g>
+</svg>
diff --git a/src/views/Contact/images/Slack.png b/src/views/Contact/images/Slack.png
new file mode 100644
index 0000000..a1e86d6
Binary files /dev/null and b/src/views/Contact/images/Slack.png differ