Flow

Connect

Flow is also an MCP server, so your AI can check the laws while it designs. No sign-in needed.

Claude Code

Run this once in a terminal.

claude mcp add --transport http flow https://flow.donta.io/api/mcp

Cursor

Add this to ~/.cursor/mcp.json.

{ "mcpServers": { "flow": { "url": "https://flow.donta.io/api/mcp" } } }

Claude app

Add a custom connector with this URL.

https://flow.donta.io/api/mcp

Tell your agent to use it

Paste this into CLAUDE.md or your Cursor rules so it happens without asking.

## Design Before designing or redesigning a screen, call Flow's design_brief and follow what it returns. After writing UI code, call Flow's audit_design on the changed files and fix every error and warning.

Slash commands

In Claude Code, Flow adds three commands. Type / and look for flow.

  • brief

    Design a screen: brief, build, then audit.

  • review

    Audit the UI you changed and fix what it finds.

  • effect

    Drop a tested effect into the project.

Tools

  • design_brief

    Start here. Describe the screen and the feel; get the laws to follow, style tokens, a fitting effect with tested code, and the final checks.

  • suggest_laws

    Give it the kind of screen (checkout, onboarding, dashboard…) and get the laws that matter, as a checklist.

  • audit_design

    Send UI files (tsx, html, css…) and get a score with line-by-line fixes.

  • get_law

    One law in full: definition, rules, what the audit checks, sources.

  • list_laws

    Every law, filterable by group or screen type.

  • get_style / list_styles

    UI styles as tokens and rules.

  • get_effect / list_effects

    Animation effects with tested, self-contained code, a build prompt and guardrails.

  • get_pattern / list_patterns

    Interactive screen patterns (login for now): complete working screens with tested code and guardrails.

Prefer plain text? The whole library is at /llms.txt.