pristine
Install
All commands and Lenses

Command edits code

/pristine init

Teach Pristine your product, your users and your design system.

Run init once per project. Pristine reads your code first: the routes, the components, the tokens, the copy. Then it asks only what the code can't tell it. The answers go into one DESIGN.md that every later command reads before it judges or builds.

Try it

  • /pristine init

    The usual start. It explores the repo, then asks a few short questions, one at a time.

  • /pristine init this is a budgeting app for freelancers who get paid irregularly

    Say what the product is up front and it skips that question.

  • /pristine init update the personas, we now sell to agencies too

    Run it again any time. It edits the existing DESIGN.md instead of starting over.

How it works

  1. Reads what already exists

    An existing DESIGN.md, README, package.json, the routes and the shared components.

  2. Explores before asking

    Pulls colors, fonts, spacing and radii from your CSS and components, so the Design System section describes what you actually ship.

  3. Asks what code can't show

    What the product does, who uses it, what they must feel in five seconds, and their deal-breakers. One question at a time, with a recommended answer first.

  4. Writes DESIGN.md

    Product, Personas, Brand, Design System and Do / Don't. The default standard is filled in for you: WCAG 2.2 AA, evergreen browsers, readable with JS off, reduced motion, LCP under 2.5s on mobile.

What you get

  • DESIGN.md at the project root
  • Two or three named Personas with a job, context and deal-breakers
  • Your real tokens, written down

Check the result

  • Read the Personas. If one doesn't sound like a real customer, say so; every score is judged through them.
  • Check the token table against your CSS. Wrong tokens mean every later fix uses the wrong values.
  • Add exceptions you need, such as "must support Safari 15" or "no dark mode".

Related