diff --git a/src/.gitignore b/src/.gitignore
new file mode 100644
index 0000000..c0fb00c
--- /dev/null
+++ b/src/.gitignore
@@ -0,0 +1 @@
+/fonts/monogram*
diff --git a/src/js/objects.js b/src/js/objects.js
index 96f0985..99c2d42 100644
--- a/src/js/objects.js
+++ b/src/js/objects.js
@@ -91,7 +91,7 @@ export class Sprite {
 }
 
 function drawDebug(context, x, y, w, h) {
-  context.font = '14px serif';
+  context.font = '16px Monogram';
   context.fillStyle = '#ffffff';
   context.fillText(`${x}x${y}`, x + 1, y - 2);
   context.fillStyle = '#000000';
diff --git a/src/js/scene.js b/src/js/scene.js
index 4f057e6..a29c013 100644
--- a/src/js/scene.js
+++ b/src/js/scene.js
@@ -37,6 +37,7 @@ export class Scene {
     this.#layers = Array();
   }
 
+  // TODO: remove it
   setScreenSize(w, h) {
     this.#canvas.width = w;
     this.#canvas.height = h;
diff --git a/src/styles.css b/src/styles.css
index ee96c18..44972d7 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1,3 +1,19 @@
+@font-face {
+	font-family: 'Monogram';
+	src: url('/fonts/monogramextended.woff2') format('woff2'),
+		url('/fonts/monogramextended.woff') format('woff'),
+		url('/fonts/monogramextended.ttf') format('truetype');
+	font-weight: 500;
+	font-style: normal;
+	font-display: swap;
+}
+
+body {
+	display: flex;
+	gap: 8px;
+	justify-content: center;
+}
+
 canvas {
 	image-rendering: crisp-edges;
 	image-rendering: pixelated;