diff --git a/src/App.js b/src/App.js
index 19f2ff4..6ca4350 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,11 +1,13 @@
 import React from 'react';
 
-import { Canvas } from 'components';
+import { Header } from 'components';
 
 function App() {
   return (
     <div className="app">
-      <Canvas />
+      <div className="canvas">
+        <Header />
+      </div>
     </div>
   );
 }
diff --git a/src/assets/scss/styles.scss b/src/assets/scss/styles.scss
index 3de4258..a9d5e5e 100644
--- a/src/assets/scss/styles.scss
+++ b/src/assets/scss/styles.scss
@@ -6,3 +6,28 @@ body {
   font-size: 14px;
   background-color: $gray-light;
 }
+
+.canvas {
+  max-width: 1000px;
+  width: 100%;
+  min-width: 500px;
+  background-color: $gray-mid;
+  margin: 0 auto;
+  border-radius: 3px;
+  display: flex;
+  justify-content: center;
+}
+
+.box {
+  border-radius: 0;
+  border-width: 3px;
+  border-style: solid;
+  background-color: $gray;
+  border-color: lighten($gray, 20%) darken($gray, 20%) darken($gray, 20%)
+    lighten($gray, 20%);
+
+  &:hover,
+  &:focus {
+    background-color: lighten($gray, 10%);
+  }
+}
diff --git a/src/components/Board/Board.js b/src/components/Board/Board.js
index 1164154..88e9e60 100644
--- a/src/components/Board/Board.js
+++ b/src/components/Board/Board.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import './styles.scss';
 
 const Board = () => {
   return <div className="board">Board here</div>;
diff --git a/src/components/Board/styles.scss b/src/components/Board/styles.scss
new file mode 100644
index 0000000..04999c1
--- /dev/null
+++ b/src/components/Board/styles.scss
@@ -0,0 +1 @@
+@import '../../assets/scss/variables';
diff --git a/src/components/Canvas/Canvas.js b/src/components/Canvas/Canvas.js
deleted file mode 100644
index 1fa513d..0000000
--- a/src/components/Canvas/Canvas.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import React from 'react';
-import { Header } from 'components';
-import './styles.scss';
-
-const Canvas = () => {
-  return (
-    <div className="canvas">
-      <Header />
-    </div>
-  );
-};
-
-export default Canvas;
diff --git a/src/components/Canvas/index.js b/src/components/Canvas/index.js
deleted file mode 100644
index dd22256..0000000
--- a/src/components/Canvas/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './Canvas';
diff --git a/src/components/Canvas/styles.scss b/src/components/Canvas/styles.scss
deleted file mode 100644
index 140fd76..0000000
--- a/src/components/Canvas/styles.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-@import '../../assets/scss/variables';
-
-.canvas {
-  max-width: 1000px;
-  width: 100%;
-  min-width: 500px;
-  background-color: $gray-mid;
-  margin: 0 auto;
-  border-radius: 3px;
-  display: flex;
-  justify-content: center;
-}
-
-.box {
-  border-radius: 0;
-  border-width: 3px;
-  border-style: solid;
-  background-color: $gray;
-  border-color: lighten($gray, 20%) darken($gray, 20%) darken($gray, 20%)
-    lighten($gray, 20%);
-
-  &:hover,
-  &:focus {
-    background-color: lighten($gray, 10%);
-  }
-}
diff --git a/src/components/index.js b/src/components/index.js
index ee7eb91..c3f1190 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1,3 +1,2 @@
-export { default as Canvas } from './Canvas';
 export { default as Header } from './Header';
 export { default as Board } from './Board';