diff --git a/mapsy/src/components/Grid.jsx b/mapsy/src/components/Grid.jsx
new file mode 100644
index 0000000..c7f2ad5
--- /dev/null
+++ b/mapsy/src/components/Grid.jsx
@@ -0,0 +1,15 @@
+import React from 'react';
+import { Rect } from 'react-konva';
+
+const Grid = ({ gridSize, canvasSize }) => {
+    const lines = [];
+    for (let i = 0; i <= canvasSize; i += gridSize) {
+        lines.push(
+            <Rect key={`v-${i}`} x={i} y={0} width={1} height={canvasSize} fill="lightgray" />,
+            <Rect key={`h-${i}`} x={0} y={i} width={canvasSize} height={1} fill="lightgray" /> 
+        );
+    }
+    return lines;
+};
+
+export default Grid;
\ No newline at end of file
diff --git a/mapsy/src/components/Toolbar.jsx b/mapsy/src/components/Toolbar.jsx
index b01f5e7..e6e5bbd 100644
--- a/mapsy/src/components/Toolbar.jsx
+++ b/mapsy/src/components/Toolbar.jsx
@@ -1 +1,12 @@
-import React from 'react';
\ No newline at end of file
+import React from 'react';
+
+const Toolbar = ({ setTool }) => {
+    return (
+        <div className="toolbar">
+            <button onClick={() => setTool('draw')}>Draw</button>
+            <button onClick={() => setTool('erase')}>Erase</button>
+        </div>
+    );
+};
+
+export default Toolbar;
\ No newline at end of file