Skip to main content
Home/Recipes/Mobile vs desktop token consistency
Audit & Compliance

Mobile vs desktop token consistency

DesignerDeveloperQA

Overview

Responsive coherence breaks quietly: type stops scaling, spacing rhythm shifts, touch targets shrink. Extract both viewports and flag every inconsistency between them.

A design system is supposed to hold together across viewports, but mobile and desktop drift apart: the type scale stops being proportional, the spacing rhythm changes, navigation colors differ, buttons fall below comfortable touch-target size. Extract the page twice, once at the default desktop viewport and once with --mobile, then compare. An agent flags inconsistencies in typography scaling, spacing rhythm, touch targets, and color usage, and recommends fixes for responsive coherence.

Desktop (default viewport)

Terminal
dembrandt example.com --save-output

Mobile viewport

Terminal
dembrandt example.com --mobile --save-output
Output

A list of responsive inconsistencies between mobile and desktop, with recommended fixes for coherence.

Browse all

All recipes →

52 workflows