Building a design token system
A very detailed and thorough overview of how to use design tokens to power a distributed design system and site architecture. The crux is ensuring design (Figma), code (CSS), and content management […]
Archives
Stop using HSL for colour systems
A fascinating (albeit quite technical) dive into how colours spaces work, and why the typical HSL colour spaces of the web and software result in problematic inconsistencies within colours. The key […]
Track design system use & adoption
A new tool that allows an organisation to check how, where, and why components are being used across shared codebases, and gain insights into their usage and […]
Intro to design token schema
An interesting look at the early draft proposal for an official design token specification and file format. The pitch is a strong one: standardise design tokens so that every tool can understand […]
Jamie's bookshelf
I'm a sucker for a personal collection displayed on the web, and I really love the simplicity of Jamie's design for his digital bookshelf. An easy rating system; simple (and fast) filters; and a very […]
Making writing readable
How do you make your writing as accessible as possible? Plain text – a system of simplifying the words and phrases used to reduce overall complexity – is an "easy" solution, and I've never seen […]
HTML kitchen sink
Daniel has created an extremely useful HTML template that includes most common elements, perfect for kickstarting a CSS design scheme, and all in a handy GitHub […]
Open Props
I've always thought the utility of Tailwind was promising, but it bugged me that the way it worked was so counter to both best practices and the web stack's architecture. Well, introducing […]
Stacks of stacks
Heydon's video is an excellent overview of their much-loved owl selector and "stack" layout pattern. I actually didn't realise that Heydon was the original "inventor" of the owl, though it makes a […]
Design systems need content designers
As someone who has been involved in a greenfield design system build for the last six months, I empathise a lot with Amy's well-worded explanation of why content design should never be […]
Types of type
Apparently, the type design world has recently thrown out its formal classification system and has yet to decide on a replacement. ILT (as ever) does a great job of summarising the current […]
The component gallery
Building a tooltip? A carousel? A password input? I can strongly recommend checking if the Component Gallery has a page on whatever UI pattern you're working […]
Collapse SVG to a single path
Very useful tool: just upload an SVG and it will attempt to output the file as a single path 👍 Fantastic for converting icon libraries for design […]
Improving online readability
Where has this article been my whole life! Andy's posts are often brilliant, but this an absolute gold mine of information, from ideal character lengths to clever type-setting tricks. And I thought I […]
A bridge over the great divide
A fascinating look at how modern front-end architecture and practices can help solve some of the communities issues; even the ones they initially created! Really neat to see how Brad has been using […]
Using IBM's Carbon Design System with NextJS
The combination of the Carbon design system and NextJS should make for rapid website development, but I ran into a few small hurdles getting them to play nicely with one another using existing documentation and community guidelines.
The design systems between us
Have design systems helped bridge the gap between designers and developers? Probably not. Is part of that potentially the increasing complexity of frontend build tooling? Possibly. Design and […]
Sparkbox Notes
Notes from my second fully remote conference, this time Sparkbox's UnConference. Being able to freely access talks from the US is a rare bonus of everything going on right now, and this did not disappoint. Musical cameos, great talks on UX, accessibility, design systems, and amazing speakers. Great event (despite the time difference).