joshua.seigler.net - pebblePersonal homepage of Joshua Seigler2026-09-21T00:00:00Zhttps://joshua.seigler.net/I made some Pebble watchfaces2026-09-21T00:00:00Zhttps://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/<p>There is a wonderful watch brand called Pebble. It was first released in 2013, as a record-setting Kickstarter campaign. It had an e-paper display and the platform was very open, with an active and passionate community releasing hundreds of watchfaces and apps. In 2016 Fitbit bought Pebble, seemingly mostly for Pebble’s excellent sleep-tracking algorithm. The Pebble community took over watch app hosting once official support was gone, around 2018. Eventually Google acquired Fitbit, and the original Pebble founder was able to re-aquire the Pebble license and code from Google, restarting watch production with a new company Core Devices.</p>
<p>I was a happy owner of one of the old-gen Pebble Time Steel watches, but mine was showing its age. When Core Devices announced new Pebble watches, I was quick to sign up. Since it has arrived, I’ve enjoyed loading up abstract, cryptic watchfaces. Many of them are implementations of designs from <a href="https://blog.tokyoflash.com/" target="_blank" rel="noopener">Tokyoflash</a>, a watch design concept blog with a futuristic, minimalist, and cryptic aesthetic.</p>
<p>Recently I decided to try my hand at making some abstract watchfaces of my own. So far I made two, as part of a series I’m calling “Primitives”, referring to primitive shapes like circles, lines, and squares.</p>
<h2 id="primitives-01" tabindex="-1"><a class="header-anchor" href="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/#primitives-01" aria-hidden="true"></a> <a href="https://apps.repebble.com/92e7a4f55adf4a4dbbe3e9b1" target="_blank" rel="noopener">Primitives 01</a></h2>
<div style="float: right; width: 16ch; max-width: 100%; aspect-ratio: calc(502 / 700); position: relative">
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-384.avif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-502.avif 502w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-128.gif" alt="Pebble Time 2 frame" style="position: absolute; inset: 0; max-width: 100%;" width="502" height="700" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-384.gif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-502.gif 502w" sizes="auto"></picture>
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/rob_YocmdX-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/rob_YocmdX-260.avif 260w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/rob_YocmdX-128.gif" alt="screenshot of Primitives 02 watchface showing time 6:36" style="border-radius: 50%; position: absolute; z-index: -1; top: 25.9%; left: 16.5%; width: 67.2%; box-shadow: 0 0 0 10px black;" width="260" height="260" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/rob_YocmdX-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/rob_YocmdX-260.gif 260w" sizes="auto"></picture></div>
<div style="float: right; width: 15ch; max-width: 100%; aspect-ratio: calc(162 / 233); position: relative">
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-384.avif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-488.avif 488w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-128.gif" alt="Pebble Time 2 frame" style="position: absolute; inset: 0; max-width: 100%;" width="488" height="700" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-384.gif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-488.gif 488w" sizes="auto"></picture>
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-200.avif 200w" sizes="auto"><source type="image/gif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-200.gif 200w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-128.jpeg" alt="screenshot of Primitives 01 watchface showing time 8:48" style="position: absolute; z-index: -1; top: 28%; left: 21%; width: 56.8%; box-shadow: 0 0 0 10px black;" width="200" height="228" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-128.jpeg 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/mtUsg_RghC-200.jpeg 200w" sizes="auto"></picture>
</div>
<p>The shading in the background covers the half furthest from the traditional clock hour mark for that hour. In this screenshot the purple shading faces 8:00. Stripes on the edge of the shading indicate tens of minutes, and three tens become a thick stripe. Here the time is 8:48. The final digit comes from treating the circles as negative space - an eight. The round time is 6:36.</p>
<h2 id="primitives-02" tabindex="-1"><a class="header-anchor" href="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/#primitives-02" aria-hidden="true"></a> <a href="https://apps.repebble.com/d931249bc31b493b95bcad59" target="_blank" rel="noopener">Primitives 02</a></h2>
<div style="float: right; width: 16ch; max-width: 100%; aspect-ratio: calc(502 / 700); position: relative">
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-384.avif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-502.avif 502w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-128.gif" alt="Pebble Time 2 frame" style="position: absolute; inset: 0; max-width: 100%;" width="502" height="700" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-384.gif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/2nS2B5yWGL-502.gif 502w" sizes="auto"></picture>
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/Es_hkanrYP-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/Es_hkanrYP-260.avif 260w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/Es_hkanrYP-128.gif" alt="screenshot of Primitives 02 watchface showing time 7:39" style="border-radius: 50%; position: absolute; z-index: -1; top: 25.9%; left: 16.5%; width: 67.2%; box-shadow: 0 0 0 10px black;" width="260" height="260" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/Es_hkanrYP-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/Es_hkanrYP-260.gif 260w" sizes="auto"></picture></div>
<div style="float: right; width: 15ch; max-width: 100%; aspect-ratio: calc(162 / 233); position: relative">
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-384.avif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-488.avif 488w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-128.gif" alt="Pebble Time 2 frame" style="position: absolute; inset: 0; max-width: 100%;" width="488" height="700" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-384.gif 384w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/uhgostcBNl-488.gif 488w" sizes="auto"></picture>
<picture><source type="image/avif" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/5y9aVwbK6z-128.avif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/5y9aVwbK6z-200.avif 200w" sizes="auto"><img loading="lazy" decoding="async" src="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/5y9aVwbK6z-128.gif" alt="screenshot of Primitives 02 watchface showing time 3:47" style="position: absolute; z-index: -1; top: 28%; left: 21%; width: 56.8%; box-shadow: 0 0 0 10px black;" width="200" height="228" srcset="https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/5y9aVwbK6z-128.gif 128w, https://joshua.seigler.net/posts/i-made-some-pebble-watchfaces/5y9aVwbK6z-200.gif 200w" sizes="auto"></picture>
</div>
<p>The second watchface uses the same scheme to convey the hour - a shaded part of the background aimed at an analog clock hour mark. The tens of minutes (green) are a large number made from arcs from a circle, and the minutes (blue) are on top of that, smaller. The left time shows 3:47. The round time shows 4:39.</p>
<div style="clear: both">
<p>When inspiration strikes for a third entry, I’ll post about it.</p>
</div>