PAYG Website Design services. Cancel anytime. See Plans

Web experiments & tools

CSS Grid + Spotify

Screenshot of Spotify albums laid out using CSS grid.

An example of CSS grid using's API to pull my Spotify albums list. You can adjust the grid to see how different settings affect the layout.

View on Codepen

CSS Colour Names

Screenshot of a directory of CSS colour names.

There are so many colour names in CSS, many which I didn't know existed. So, I created this little tool to document them. It provides the alternate Hex and RGB values for each colour.

View CSS Colour Names

JSON Generator

Screenshot of a JSON generator tool useful for Shopify metafields.

This tool is for creating JSON formatted code for use with Shopify's JSON metafields. It's main use is for product specification sheets/tables displayed on the product pages.

View JSON Generator

CSS Animations

Screenshot of the previous homepage of this website.

A copy of the previous version of this website's homepage. Here you can look into the source and see how it all worked. The animations are all in CSS with a little bit of JavaScript to help trigger them.

View CSS Animations