BEFOREVIBE
For developers

BEFOREVIBE in Claude Code

Generate a PRD, a logo, and screen previews from your Claude Code session — without opening the site.

MCP URLhttps://beforevibe.com/api/mcp

What the connector does

Connect BEFOREVIBE as a remote MCP server. From any Claude Code conversation, you can create a complete app specification: describe your idea, answer a short direction artistique interview (style, colours, mobile or web), and get back a full PRD, a logo, and screen previews — billed to your BEFOREVIBE account.

How to connect

  1. 01

    Open MCP settings

    In Claude Code, add a remote MCP server.

  2. 02

    Enter the connector URL

    https://beforevibe.com/api/mcp

  3. 03

    Sign in with OAuth

    Claude Code opens a sign-in page — log in with your BEFOREVIBE account. This links your credit balance.

  4. 04

    Start a project

    Ask Claude to start a BEFOREVIBE project. It will interview you about your idea and design direction: style, colours, and whether the app is mobile or web.

What it costs

PRD
Free — always.
Logo
1 credit (optional).
Each screen preview
1 credit (optional).
Grouped billing
Before any image is generated, Claude shows you the total (logo + N screens = N+1 credits) and waits for your confirmation.
Free credits
5 credits every month. They refill to 5 at the start of each month — unused credits don’t carry over.
Top-up packs
$5 = 40 credits or $10 = 100 credits. Purchased credits never expire.

Example prompt

“Start a BEFOREVIBE project for a leave-request tool: employees submit time-off requests, managers approve or decline, HR is notified. Mobile app, modern minimal style, warm tones.”

FAQ

Does it work with Cursor, GitHub Copilot or OpenAI Codex?

Yes. BEFOREVIBE runs a standard Streamable HTTP MCP server. Any client that supports the MCP protocol can connect with the same URL (https://beforevibe.com/api/mcp). Configuration steps vary by client.

Do I need a BEFOREVIBE account?

Yes — the OAuth step on first connect creates or links your account. Your free monthly credits and any top-up packs are tied to that account.

What is the direction artistique interview?

Before generating images, Claude asks a few short questions: preferred style, colours, and whether the app is mobile or web. It is the same step the BEFOREVIBE site runs, and it determines how your logo and screen previews look.

Can I get a PRD without spending any credits?

Yes. Generating the PRD is always free. Credits are only used when you choose to generate a logo or screen previews.

Where do I find my deliverables?

Claude gives you two links: a public BEFOREVIBE library page and a direct download link for a signed ZIP containing the PRD markdown, DESIGN.md, and all generated images.

← BEFOREVIBE