Projects
A list of my projects and rabbit hole deep-dives.
Web Projects Permalink ¶
<relative-time>
A Web Component to display a relative time. There are many like it, but this one is mine.
<event-countdown>
A Web Component to display an event countdown.
<paper-stamp>
A Web Component to display an img as a paper stamp.
<svg-sparkline>
A Web Component for building an SVG Sparkline.
<instant-photo>
A Web Component for presenting an img like an instant photograph.
<theme-selector>
A Web Component to set a site-wide theme preference using a native select element, saved to local storage.
NewBase60 Calculator
Web-based tool for using NewBase60 to convert between binary, decimal, sexagesimal, and date.
clamp() Calculator
Handy little tool for calculating viewport/container-based clamped values for use in CSS.
Browser Feature Watch
This page serves as an one-stop shop to keep track of feature support across the major, modern browsers, ordered by level of support. Updated automatically daily.
eleventy-cache-webmentions
Cache webmentions using eleventy-fetch and make them available to use in collections, layouts, pages, etc. in Eleventy.
<spark-line>
A Web Component to turn an array of integers into a fun little chart.
Pentatonic
Turn any array of integers into a fun little melody using the Web Audio API.
Bowhead
Memorable and maintainable design tokens in SCSS.
OwnYourBeer
Basically abandoned. An IndieWeb tool to help you pull check-ins from Untappd.
Corvus
Corvus is a PHP-based Micropub endpoint
Media Controls
YouTube-like controls for any audio or video elements
Weather
Not the most interesting of project titles, this is a personalised weather web app.
Reptile C
My personal (and automatic) URL-shortening service based on Tantek Çelik’s base-60 numbering system, NewBase60. Note: the homepage just redirects to this website, but you can read about how it works here: Generating Automatic ShortURLs with NewBase60.
Viewport Dimensions
A very simple tool to measure your viewport dimensions.
My Featured Pens on CodePen
Pens of mine that were featured on CodePen.
Personal Projects Permalink ¶
Fëonir’s Workshop
Another D&D-related labour of love, this time a general site for all things D&D, including the draft of my new 12-chapter campaign for 5th Edition.
Micrathene
Super Simple PWA for building Microlite20 characters.
Waterdeep, A Curated Guide
I’m the Game Master for a D&D campaign of Waterdeep: Dragon Heist. This is a chronicle of my players’ time spent in Waterdeep.
BloodBuilder
Super Simple PWA for 1e Pathfinder Pure Core Classes.
GIFs on GIFs on GIFs
A curated list of sick GIFs.
Feelin’ Dizzy
Feelin’ dizzy or blue? This should sort you right out.
chrisburnell.com in the past Permalink ¶
Version 3
The third version of my personal site where I switched over to using Eleventy and got hooked on working on my website!
Version 2
The second version of my personal site that I used for over six years and laid the groundwork and mentality for the next version.
Version 1
The first-ever version of my personal site. Things have changed slightly since 2008.