diff --git a/build-and-run.sh b/build-and-run.sh
index 1f4c99b..6b5ceab 100755
--- a/build-and-run.sh
+++ b/build-and-run.sh
@@ -2,9 +2,9 @@
 
 set -ex
 
-gcc -o pialarm src/main.c \
+gcc -o pialarm src/* \
         -Wall -std=c99 -D_DEFAULT_SOURCE -Wno-missing-braces -Wunused-result -O2 \
-        -I. -Iraylib-5.5/src -Iraylib-5.5/src/external -I/usr/local/include  -Iclay-0.13 \
+        -I. -Iraylib-5.5/src -Iraylib-5.5/src/external -I/usr/local/include -Iclay-0.13 -Iinclude \
         -L. -Lraylib-5.5/src -Lraylib-5.5/src -L/usr/local/lib \
         -lraylib -lGL -lm -lpthread -ldl -lrt -lX11 -latomic -flax-vector-conversions \
         -D_DEFAULT_SOURCE -DPLATFORM_DESKTOP -DPLATFORM_DESKTOP_GLFW
diff --git a/include/7segment.h b/include/7segment.h
new file mode 100644
index 0000000..a6a84de
--- /dev/null
+++ b/include/7segment.h
@@ -0,0 +1 @@
+void Render7Segment(int width, int height, int number);
diff --git a/src/7segment.c b/src/7segment.c
new file mode 100644
index 0000000..1562492
--- /dev/null
+++ b/src/7segment.c
@@ -0,0 +1,172 @@
+#pragma once
+
+#include "clay.h"
+
+// TODO: Optimize this, not good code.
+bool shouldBeOn(int number, int segment) {
+    switch (segment) {
+        case 0: // 2, 3, 4, 5, 6, 8, 9
+            return number == 2 || number == 3 || number == 4 || number == 5 || number == 6 || number == 8 || number == 9;
+        case 1: // 0, 4, 5, 6, 8, 9
+            return number == 0 || number == 4 || number == 5 || number == 6 || number == 8 || number == 9;
+        case 2: // 0, 2, 3, 5, 6, 7, 8, 9
+            return number == 0 || number == 2 || number == 3 || number == 5 || number == 6 || number == 7 || number == 7 || number == 8 || number == 9;
+        case 3: // 0, 1, 2, 3, 4, 7, 8, 9
+            return number != 5 && number != 6;
+        case 4: // 0, 1, 3, 4, 5, 6, 7, 8, 9
+            return number != 2;
+        case 5: // 0, 2, 3, 5, 6, 8
+            return number == 0 || number == 2 || number == 3 || number == 5 || number == 6 || number == 8;
+        case 6: // 0, 2, 6, 8
+            return number == 0 || number == 2 || number == 6 || number == 8;
+    }
+    return false;
+}
+
+// Dimensions for the expected aspect ratio:
+//  width: 105
+//  height 205
+void Render7Segment(int width, int height, int number) {
+    Clay_Color offColor = {225, 225, 225, 255};
+    Clay_Color onColor = {0, 0, 0, 255};
+    float radius = width * 0.07143;
+
+    CLAY({
+        .layout = {
+            .sizing = {
+                .width = width,
+                .height = height,
+            },
+            .layoutDirection = CLAY_TOP_TO_BOTTOM,
+        }
+    }) {
+        CLAY({
+            .layout = {
+                .sizing = {
+                    .height = CLAY_SIZING_PERCENT(0.064),
+                    .width = CLAY_SIZING_GROW(),
+                },
+                .layoutDirection = CLAY_LEFT_TO_RIGHT,
+            },
+        }) {
+            ExpandContainer();
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 2) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.905),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                },
+            }) {}
+            ExpandContainer();
+        }
+        CLAY({
+            .layout = {
+                .sizing = {
+                    .height = CLAY_SIZING_PERCENT(0.404),
+                    .width = CLAY_SIZING_GROW(),
+                },
+                .layoutDirection = CLAY_LEFT_TO_RIGHT,
+            },
+        }) {
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 1) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.143),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                }
+            }) {}
+            ExpandContainer();
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 3) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.143),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                }
+            }) {}
+        }
+        CLAY({
+            .layout = {
+                .sizing = {
+                    .height = CLAY_SIZING_PERCENT(0.064),
+                    .width = CLAY_SIZING_GROW(),
+                },
+                .layoutDirection = CLAY_LEFT_TO_RIGHT,
+            },
+        }) {
+            ExpandContainer();
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 0) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.905),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                },
+            }) {}
+            ExpandContainer();
+        }
+        CLAY({
+            .layout = {
+                .sizing = {
+                    .height = CLAY_SIZING_PERCENT(0.404),
+                    .width = CLAY_SIZING_GROW(),
+                },
+                .layoutDirection = CLAY_LEFT_TO_RIGHT,
+            },
+        }) {
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 6) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.143),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                }
+            }) {}
+            ExpandContainer();
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 4) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.143),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                }
+            }) {}
+        }
+        CLAY({
+            .layout = {
+                .sizing = {
+                    .height = CLAY_SIZING_PERCENT(0.064),
+                    .width = CLAY_SIZING_GROW(),
+                },
+                .layoutDirection = CLAY_LEFT_TO_RIGHT,
+            },
+        }) {
+            ExpandContainer();
+            CLAY({
+                .backgroundColor = shouldBeOn(number, 5) ? onColor : offColor,
+                .cornerRadius = CLAY_CORNER_RADIUS(radius),
+                .layout = {
+                    .sizing = {
+                        .width = CLAY_SIZING_PERCENT(0.905),
+                        .height = CLAY_SIZING_GROW(),
+                    },
+                },
+            }) {}
+            ExpandContainer();
+        }
+    }
+}