Use case

Give your AI coding tools real design context.

AI coding tools produce generic interfaces when all they have is a sentence. Connect Nyabag over MCP and they can read the references you've chosen: real palettes and fonts as tokens, a brief of what a library has in common, and the screenshots themselves.

Step by step

  1. Connect Nyabag

    Add the server to Claude Code or Cursor, then sign in once. There are no API keys.

  2. Collect the look you want

    Save a handful of sites into a library, or run Research on what you're building.

  3. Ask for a brief

    Have your tool call design_brief on the library, for shared colors, fonts, sections and radius.

  4. Build from real values

    Ask it to pull tokens with get_design_tokens in CSS or Tailwind v4, then build the page from those.

Tips

  • Point your tool at a specific library. A focused set gives a clearer brief.
  • Review token roles before using them. Roles such as background and primary are inferred.
  • Save pages with save_bookmark while you work, without leaving your editor.

Good to know

  • Tokens describe what a site uses, and you're responsible for fonts' licenses and brands' rights.
  • Your AI tool's own terms apply to what it reads from Nyabag.

Features used

Build your design memory before you need it.

Start free