Understanding Aspect Ratio Calculator
A practical guide to Aspect Ratio Calculator: what it means, how it works, and how to use the interactive aspect ratio calculator.
Design writing with an opinion, and tools that back it up.
Design Blog is the UK's independent home for design criticism, studio profiles and practical browser tools, written for working designers who want more than agency marketing copy.
Try the CSS Variable Architect Check a palette with True-Contrast Smart PaletteLatest writing
Criticism, tool breakdowns and analysis, in the order it went up.
Understanding CSS Specificity Calculator
A practical guide to CSS Specificity Calculator: what it means, how it works, and how to use the interactive css specificity calculator.
Understanding CSS Unit Converter (px / rem / em / vw / vh)
A practical guide to CSS Unit Converter (px / rem / em / vw / vh): what it means, how it works, and how to use the interactive css unit converter (px / rem / em / vw / vh).
Understanding CSS Variable Architect
A practical guide to CSS Variable Architect: what it means, how it works, and how to use the interactive css variable architect.
Understanding Cubic Bezier Architect
A practical guide to Cubic Bezier Architect: what it means, how it works, and how to use the interactive cubic bezier architect.
Understanding Focus Ring Architect
A practical guide to Focus Ring Architect: what it means, how it works, and how to use the interactive focus ring architect.
Understanding CSS Grid Architect
A practical guide to CSS Grid Architect: what it means, how it works, and how to use the interactive css grid architect.
Understanding Performance Budget Calculator
A practical guide to Performance Budget Calculator: what it means, how it works, and how to use the interactive performance budget calculator.
Understanding SERP Snippet Previewer
A practical guide to SERP Snippet Previewer: what it means, how it works, and how to use the interactive serp snippet previewer.
Understanding True-Contrast Smart Palette
A practical guide to True-Contrast Smart Palette: what it means, how it works, and how to use the interactive true-contrast smart palette.
Find your way around the site
A running collection of tools, showcases and directories built alongside the writing, for whenever reading isn't quite what you need.
Free tools for daily work
CSS variable setup, contrast checking, unit conversion and aspect ratio maths, built for the jobs you do most.
Browse the tools →Critical takes on real work
Rebrands, interfaces and campaigns examined for what actually holds up.
Read the criticism →Showcases worth studying
Design work selected for what it does well.
See the showcases →UK studios, listed properly
A directory of design studios across the UK, organised so you can actually find who does what and where.
Explore the directory →Terms explained in context
A glossary that treats each term as something you'd use.
Look up a term →Award deadlines in one place
The UK and international design awards worth tracking, with entry dates gathered so you stop finding out too late.
Check the calendar →Two tools worth having open while you build
The CSS Variable Architect turns a colour and type scale into ready-to-use variables, and the True-Contrast Smart Palette checks whether those colours will actually hold up against each other. Neither one is guaranteed to get it right, so check the output before you ship it.