css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.

Blue Notes

These are the first of the Blue Note Sleeves I started making in late 2017 and the same sleeves I spoke about at Ampersand Conference and that were featured in NetMag this December.

All the sleeves and typography are fluid, the 'remixes' are updates to previous sleeves incorporating CSS grid, filters and blend modes. Cornbread is the most up to date sleeve and removes an earlier reliance on absolute positioning and has fully semantic layout, fluid typography and was built using CSS grid.

You can read more about how I made the sleeves here:

http://stevehoneyman.co.uk/blog/blue-notes/

http://stevehoneyman.co.uk/blog/blue-notes-remixed/