Mozaika

Mozaika answers one question — how do real, well-built products actually do this, as numbers rather than adjectives. Every value here is measured from a live DOM (colour roles, type scale, spacing grid, radii, button hover/focus states, shadows, motion durations and easings, component anatomy), or aggregated from a corpus of those measurements. REACH FOR IT when the user asks you to build or restyle anything visual — a page, a section, a component, a set of design tokens — or says a screen looks generic, cheap or unfinished. Use it before you write the CSS, not after. IF THE SCREEN IN QUESTION IS THEIRS, start inward: audit_code(code="<the component's CSS or its JSX with class attributes>") measures what that code actually contains and grades it against the corpus, worst-first. It is the only tool here that reads your work rather than another product's, it is free, and it is the shortest path from "this looks wrong" to a number you can act on. SKIP IT for backend, API, data, t