diff --git a/src/snake.html b/src/snake.html
new file mode 100644
index 0000000..5498653
--- /dev/null
+++ b/src/snake.html
@@ -0,0 +1,11 @@
+
+
+
+
+ Snake
+
+
+
+
+
+
diff --git a/src/snake.js b/src/snake.js
new file mode 100644
index 0000000..7e0b8a8
--- /dev/null
+++ b/src/snake.js
@@ -0,0 +1,97 @@
+var y = 70
+var x = 70;
+var direction = "none"
+
+
+function run() {
+
+ document.addEventListener("keydown", (event) => {
+
+ if (event.key == "ArrowRight") {
+ direction = "right"
+ }
+ if (event.key == "ArrowLeft") {
+ direction = "left"
+
+ }
+ if (event.key == "ArrowDown") {
+ direction = "down"
+ }
+ if (event.key == "ArrowUp") {
+ direction = "up"
+ }
+ });
+
+
+ update()
+}
+
+async function update() {
+ controle()
+ checkeating()
+ draw()
+ await new Promise(() => setTimeout(update, 0.033333));
+}
+
+function checkeating() {
+
+ // x = 70
+ // y = 70
+ if (x > 150 && x < 220) {
+ if (y > 150 && y < 220) {
+ console.log("yummy")
+ }
+ }
+ if (x + 100 > 150 && x + 100 < 220) {
+ if (y > 150 && y < 220) {
+ console.log("yummy")
+ }
+ }
+ if (x + 100 > 150 && x + 100 < 220) {
+ if (y + 100 > 150 && y + 100 < 220) {
+ console.log("yummy")
+ }
+ }
+ if (x > 150 && x < 220) {
+ if (y + 100 > 150 && y + 100 < 220) {
+ console.log("yummy")
+ }
+ }
+}
+
+function controle() {
+ if (direction == "right") {
+ x = x + 0.08
+
+ }
+ if (direction == "left") {
+ x = x - 0.08
+
+ }
+ if (direction == "down") {
+ y = y + 0.08
+
+ }
+ if (direction == "up") {
+ y = y - 0.08
+ }
+}
+
+
+function draw() {
+ const canvas = document.getElementById("welt");
+ const ctx = canvas.getContext("2d");
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ ctx.fillStyle = "lightGreen"
+ ctx.fillRect(0, 0, canvas.width, canvas.height)
+
+ ctx.fillStyle = "purple";
+ ctx.fillRect(10, 10, 100, 100);
+
+ ctx.fillStyle = "red";
+ ctx.fillRect(x, y, 100, 100)
+
+ ctx.fillStyle = "yellow"
+ ctx.fillRect(150, 150, 70, 70)
+
+}