Dice, Cards, & Chess
- Grids of arbitrary pips
- Playing cards: ace through king
- Chess position display Playing Cards with labels
Chess Viewer
Step through a recorded chess game. Encapsulated Transparent Chess Widget
Retro Watch
Example of SVG decorations and finer adjustments
World Time
- Browse time zones!
- 16-segment display for city names
- Responsive layout for mobile browsers
Clock
- Toggle seconds display by clicking on the time.
- Color-coded to the day of the week
- Kanji day of the week
- 24-hour time with leading zero
- Standard date format
- Day of the week and month spelled out in full
7-Segment Display
Crisply scaled old-school clock in a variety of colors
Pebble Time watch face
Pebble Time was the 2nd and final iteration of a smart-watch from a startup that was later acquired by Fitbit, which was later acquired by Google.
The hardware had an always-on LCD display with a similar resolution to a Game Boy, but in portrait with 64 colors. My demo does not take advantage of the full resolution, opting for pixel doubling to ensure legibility, resulting in a blockier aesthetic.
The Pebble SDK isn't very useful unless you have the corresponding hardware, so this watch face demonstration uses HTML canvas.
Minimal Demo
Similar to other pages, sans many features.
Pixel Font Demo
Supplementary content designed for the Pebble Time watch face page.
- Favicon clock
- Time offset slider
- Theme switcher
- Pixel font printouts
- Text colors
- Weather, color-coded
- Grid background (helps developer line up text visually)
The 5x5 pixel font is called Bagua, as 5 rows and columns is just enough resolution for a trigram. The font was made for this watch face because it can act much like a 7-segment display, with the added benefit of a saner approach to rendering the Roman alphabet and other symbols, typically in the ASCII character set.
Pixel Fonts HD
Modified to support more than one size of pixel font. Fonts comparable to some Japanese fitness watches, with desired adjustments.