diff --git a/src/index.ts b/src/index.ts
index f1d0671..add0ddb 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -52,7 +52,7 @@ const websites = [{
 	sitename: "committees",
 	title: "IEEE at UCSD",
 	description: "",
-	jsfile: "js/index.js",
+	jsfile: "js/committees.js",
 	cssfile: "css/styles.css",
 	themecolor: ""
 },
diff --git a/src/public/.DS_Store b/src/public/.DS_Store
new file mode 100644
index 0000000..2bef5b0
Binary files /dev/null and b/src/public/.DS_Store differ
diff --git a/src/public/committees.tsx b/src/public/committees.tsx
new file mode 100644
index 0000000..16221d0
--- /dev/null
+++ b/src/public/committees.tsx
@@ -0,0 +1,51 @@
+import * as ReactDom from "react-dom";
+import * as React from "react";
+import TopBar from "./components/TopBar";
+import {ACTIVE_PAGES, SOCIALS, EMAIL, OFFICERS} from "./Config";
+import Splash from "./components/Splash";
+import DefaultSection from "./components/DefaultSection";
+import InvolveBox from "./components/InvolveBox";
+import SocialCard from "./components/SocialCard";
+import Carousel from "./components/Carousel";
+import Footer from "./components/Footer";
+
+interface MainProps {}
+interface MainState {}
+
+class Main extends React.Component<MainProps, MainState> {
+	constructor(props: MainProps) {
+		super(props);
+		this.state = {};
+	}
+	public render() {
+		return <>
+			<TopBar links={ACTIVE_PAGES}></TopBar>
+			<Splash cta="Committees" delay={2000} backgrounds={["img/backgrounds/robocar.png"]}></Splash>
+			<DefaultSection title="Join us!" paragraphs={[
+				"Our Technical, Social, Professional, PR, Outreach committees work hard to spread IEEE's message. To apply, please contact us! We would love to have you in our team."
+			]}>
+			</DefaultSection>
+			<DefaultSection className={"our-comms"} title="Our Committees">
+				<div className="cards">
+					<InvolveBox boxTitle="" image="img/committees/technical.jpg" description="Technical Committee"></InvolveBox>
+					<InvolveBox boxTitle="" image="img/committees/social.jpg" description="Social Committee"></InvolveBox>
+					<InvolveBox boxTitle="" image="img/committees/professional.jpg" description="Professional Committee"></InvolveBox>
+					<InvolveBox boxTitle="" image="img/committees/pr.jpg" description="PR Committee"></InvolveBox>
+					<InvolveBox boxTitle="" image="img/committees/outreach.jpg" description="Outreach Committee"></InvolveBox>
+				</div>
+			</DefaultSection>
+			<DefaultSection title="Have questions? Contact us!">
+				<div className="join-scls">{
+					[...EMAIL, ...SOCIALS].map(n => (
+						<SocialCard url={n.url} image={n.icon} message={n.message}></SocialCard>
+					))
+				}</div>
+			</DefaultSection>
+			<Footer></Footer>
+		</>;
+	}
+}
+
+ReactDom.render(<Main></Main>, document.getElementById("root"));
+
+export default {};
\ No newline at end of file
diff --git a/src/public/img/.DS_Store b/src/public/img/.DS_Store
index dcd0cd5..50442b8 100644
Binary files a/src/public/img/.DS_Store and b/src/public/img/.DS_Store differ
diff --git a/src/public/img/committees/outreach.jpg b/src/public/img/committees/outreach.jpg
new file mode 100644
index 0000000..b4b6572
Binary files /dev/null and b/src/public/img/committees/outreach.jpg differ
diff --git a/src/public/img/committees/pr.jpg b/src/public/img/committees/pr.jpg
new file mode 100644
index 0000000..cbb8288
Binary files /dev/null and b/src/public/img/committees/pr.jpg differ
diff --git a/src/public/img/committees/professional.jpg b/src/public/img/committees/professional.jpg
new file mode 100644
index 0000000..2cd3377
Binary files /dev/null and b/src/public/img/committees/professional.jpg differ
diff --git a/src/public/img/committees/social.jpg b/src/public/img/committees/social.jpg
new file mode 100644
index 0000000..b6accbb
Binary files /dev/null and b/src/public/img/committees/social.jpg differ
diff --git a/src/public/img/committees/technical.jpg b/src/public/img/committees/technical.jpg
new file mode 100644
index 0000000..5101ddd
Binary files /dev/null and b/src/public/img/committees/technical.jpg differ