diff --git a/apps/canvas/src/components/icon.tsx b/apps/canvas/src/components/icon.tsx
new file mode 100644
index 0000000..fd01746
--- /dev/null
+++ b/apps/canvas/src/components/icon.tsx
@@ -0,0 +1,16 @@
+import { NodeType } from "@/lib/state";
+import { MdStorage } from "react-icons/md";
+import { SiGithub, SiIngress, SiJunipernetworks, SiMongodb, SiPostgresql, SiServerfault } from "react-icons/si";
+
+export function Icon(type: NodeType | undefined): React.ReactElement {
+    switch (type) {
+        case "app": return (<SiServerfault />);
+        case "github": return (<SiGithub />);
+        case "gateway-https": return (<SiIngress />);
+        case "gateway-tcp": return (<SiJunipernetworks />);
+        case "mongodb": return (<SiMongodb />);
+        case "postgresql": return (<SiPostgresql />);
+        case "volume": return (<MdStorage />);
+        case undefined: throw new Error("MUST NOT REACH!");
+    }
+}
\ No newline at end of file