diff --git a/apps/clock/apps/web/src/lib/components/clock-faces/ClockFace.svelte b/apps/clock/apps/web/src/lib/components/clock-faces/ClockFace.svelte
new file mode 100644
index 000000000..5d0dc0bf2
--- /dev/null
+++ b/apps/clock/apps/web/src/lib/components/clock-faces/ClockFace.svelte
@@ -0,0 +1,61 @@
+
+
+
diff --git a/apps/clock/apps/web/src/lib/components/clock-faces/ClockFaceBauhaus.svelte b/apps/clock/apps/web/src/lib/components/clock-faces/ClockFaceBauhaus.svelte
new file mode 100644
index 000000000..53aba8a76
--- /dev/null
+++ b/apps/clock/apps/web/src/lib/components/clock-faces/ClockFaceBauhaus.svelte
@@ -0,0 +1,203 @@
+
+
+
+
+
+
+
+
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {timeString}
+
+
+
+
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+ {#if i % 5 !== 0}
+
+ {/if}
+ {/each}
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+ {#each romanNumerals as numeral, i}
+
+ {numeral}
+
+ {/each}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+
+ {/each}
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+
+
+
+
+
ELEGANT
+
+
+
+
+
+
+
+
+
+
+
+
+ {h1}
+
+
+ {h1}
+
+
+
+
+
+ {h2}
+
+
+ {h2}
+
+
+
+
+
+
+
+
+
+
+
+ {m1}
+
+
+ {m1}
+
+
+
+
+
+ {m2}
+
+
+ {m2}
+
+
+
+
+
+
+
+
+
+
+
+ {s1}
+
+
+ {s1}
+
+
+
+
+
+ {s2}
+
+
+ {s2}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {timeString}
+ {timeString}
+
+
+
+
+ {secondsString}
+
+
+
+
+
+
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+
+ {/each}
+
+
+ {#each numbers as num, i}
+
+ {num.toString().padStart(2, '0')}
+
+ {/each}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#each patterns[h1] as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+ {#each patterns[h2] as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each colonPattern as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each patterns[m1] as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+ {#each patterns[m2] as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each colonPattern as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each patterns[s1] as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+ {#each patterns[s2] as row}
+
+ {#each row as dot}
+
+ {/each}
+
+ {/each}
+
+
+
+
+
+
+
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+
+
+
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+ {#if i % 5 !== 0}
+
+ {/if}
+ {/each}
+
+
+ {#each numbers as num, i}
+
+ {num}
+
+ {/each}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#each Array(8) as _, i}
+
+ {/each}
+
+
+
+ {#each Array(60) as _, i}
+
+ {/each}
+
+
+ {#each numbers as num, i}
+
+ {num}
+
+ {/each}
+
+
+
+ {#each Array(8) as _, i}
+
+ {/each}
+
+
+
+
+
MARINE
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {timeString}
+ {timeString}
+ {timeString}
+
+
+
+
+ {secondsString}
+ {secondsString}
+ {secondsString}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ TIME
+ {timeString}
+
+
+
+
+
+
+ SYNC
+
+
+
+ TRAC
+
+
+
+
+
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+ {#if i % 5 !== 0}
+
+ {/if}
+ {/each}
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+ {#each numbers as num, i}
+
+ {num}
+
+ {/each}
+
+
+
SBB CFF FFS
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#each pixelPatterns[h1] as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+ {#each pixelPatterns[h2] as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each colonPattern as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each pixelPatterns[m1] as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+ {#each pixelPatterns[m2] as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each colonPattern as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+
+
+ {#each pixelPatterns[s1] as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+ {#each pixelPatterns[s2] as row}
+
+ {#each row as pixel}
+
+ {/each}
+
+ {/each}
+
+
+
+
+
+
+
+ {#each Array(120) as _, i}
+
+ {/each}
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+
+ {/each}
+
+
+ {#each mainNumbers as { num, angle }}
+
+ {num}
+
+ {/each}
+
+
+
+ CHRONO
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
clock@system:~
+
+
+
+
+
+ $
+ date --format="%T"
+
+
+
+ {timeString}
+
+
+
+ $
+ date --format="%a %b %d"
+
+
+
+ {dateString}
+
+
+
+ $
+ _
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#each digits as digit, i}
+ {#if digit === -1}
+
:
+ {:else}
+
+ {/if}
+ {/each}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {#each Array(60) as _, i}
+ {#if i % 5 !== 0}
+
+ {/if}
+ {/each}
+
+
+ {#each Array(12) as _, i}
+
+ {/each}
+
+
+ {#each numbers as num, i}
+
+ {num}
+
+ {/each}
+
+
+
+ VINTAGE
+ EST. 1920
+
+
+
+
+
+
+
+
+
+
+
+
{$_('clockFaces.currentSelection')}
+
+
+
+
+ {$_(CLOCK_FACES.find((f) => f.id === selectedFace)?.nameKey || '')}
+
+
+
+
+
+
+ {$_('clockFaces.analog')}
+
+ {#each analogFaces as face}
+
+ {/each}
+
+
+
+
+ {$_('clockFaces.digital')}
+
+ {#each digitalFaces as face}
+
+ {/each}
+
+