Standout
Anti-slop design taste for AI coding agents - so AI-built and vibe-coded sites stop looking generic or AI-generated.
What it can do
- Get Design Direction: Get a complete, distinctive, reference-backed art direction for a website: palette with exact hex roles, type pairing, layout DNA, hero spec, component treatments, imagery rules,
- List Directions: Browse the full 'pick a vibe' menu: all 14 named art directions (9 light-base, 5 dark-base) with their taglines, vibe tags, and what each is best for. Use when the user wants to SEE t
- Get App Theme: Get a LOCKED design-token system for application UI (dashboards, admin panels, SaaS tools): every color role contrast-checked, exactly two radii, a five-step type scale, spacing, elevat
What data it sees
Do you need an account
No: the server works without sign-in
Anti-slop design taste for AI coding agents - so AI-built and vibe-coded sites stop looking generic or AI-generated.
Standout gives your agent 14 hand-built art directions, production section code, premium components, motion recipes, and a brutal design critic that scores any page 0-100 across 8 categories, with WCAG contrast and mobile layout computed from the real rendered page. Every URL critique also mints a shareable public score report.
Start free, in-chat: connect without a key and ask your agent to call get_free_trial_key - it self-provisions a 25-call trial without leaving the conversation.
We eat our own cooking: our homepage is held to the same critic. It blocked us at 83/100 until we fixed everything it found - live report: https://standoutmcp.io/report/8mRd51xQhFMS
Works with Claude Code, Cursor, Codex, Windsurf, claude.ai, ChatGPT, PayMeGPT and any MCP client. Keys and docs at https://standoutmcp.io
How to connect
How to connect Standout to Claude
The server address to paste into Claude settings:
https://standout--limitlessmarketingfj.run.tools
- Open Claude (claude.ai or the desktop app).
- Go to Settings → Connectors.
- Click Add custom connector.
- Paste the server address copied below into Remote MCP server URL and click Add.
- In a chat, click + → Connectors and switch the new connector on.
Custom connectors are available on Free, Pro, Max, Team and Enterprise plans (Free is limited to one). On Team and Enterprise an organization Owner adds the connector first under Organization settings → Connectors.
Authorization
After you click Add, a sign-in window for the service opens. Sign in with your own account and approve access. Claude never sees your password.
How to connect Standout to ChatGPT
The server address to paste into ChatGPT settings:
https://standout--limitlessmarketingfj.run.tools
- Open ChatGPT in a browser (chatgpt.com). A Plus, Pro, Business, Enterprise or Edu plan is required.
- Turn on developer mode once: Settings → Apps → Advanced settings → Developer mode.
- Open Settings → Connectors and click Create.
- Fill in the form: Name (anything), Description (one line about what the service does), MCP server URL (copy it below).
- Under Authentication choose OAuth if the service requires sign-in, otherwise None. Click Create.
- In a new chat open + → Apps/Connectors and enable the connector.
OpenAI has renamed this section before (Connectors → Apps/Plugins). If the label differs, search settings for "developer mode". On Business/Enterprise workspaces an admin must allow custom connectors first.
Authorization
On first use ChatGPT opens the service's sign-in window. Sign in and approve access.
How to connect Standout to Cursor
The server address to paste into Cursor settings:
https://standout--limitlessmarketingfj.run.tools
Fastest: click Open in Cursor below and confirm the prompt.
Manually:
- In Cursor open Settings → Cursor Settings → MCP and click Add new global MCP server.
- Paste the JSON copied below into
~/.cursor/mcp.json(per project:.cursor/mcp.jsonin the repo root). - Save the file. The server appears in the MCP list; authorize it there if asked.
Authorization
If the service needs sign-in, an authorize button appears next to the server in the MCP list.
Server tool list (25)
Raw names from tools/list. Only developers need these.
| get_design_direction | Get a complete, distinctive, reference-backed art direction for a website: palette with exact hex roles, type pairing, layout DNA, hero spec, component treatments, imagery rules, matched motion recipes, and public-product reference evidence. Use FIRST, before building, so the site has a coherent direction instead of defaults. The catalog holds 14 directions: 9 with light base palettes and 5 dark — pass tone to constrain. If you only know the business name, call it anyway: the response will give you a few quick questions to ask the user, then call again with their answers as vibe/audience. REDESIGNS: if the business has an existing website, pass its URL as current_site_url — Standout fetches it server-side and returns a content inventory (services, prices, hours, contacts) plus a redesign protocol, so no questions are needed. |
| list_directions | Browse the full 'pick a vibe' menu: all 14 named art directions (9 light-base, 5 dark-base) with their taglines, vibe tags, and what each is best for. Use when the user wants to SEE the available directions and choose one themselves, rather than have get_design_direction auto-pick from the business. Pick an id from the menu and pass it as the `direction` argument to get_section_code, get_asset_pack, get_hero_concept, or synthesize_direction_from_references. Browsing the menu does not consume a metered call. |
| get_app_theme | Get a LOCKED design-token system for application UI (dashboards, admin panels, SaaS tools): every color role contrast-checked, exactly two radii, a five-step type scale, spacing, elevation and motion tokens, plus a Tailwind v4 semantic mapping, the theme's usage law, and the app-UI slop rulebook. This is how a vibe-coded app stops looking AI-generated: install the theme once and every view the agent builds matches. Call with NO theme to browse the menu (free); call with a theme id to receive the full system. Themes share brand DNA with the website directions, so a client's site and app stay on one identity. |
| get_component_code | Get FINISHED application-UI components (React + Tailwind, zero dependencies) written against a Standout app theme's semantic tokens: app shell with sidebar/topbar, stat row with mono tabular metrics, data table with layout-matched loading skeletons + instructive empty state + inline retryable error, and a settings form with inline validation, sticky save bar and a two-step danger zone. States are built in, so the agent wires data and content instead of inventing structure. Install the theme first via get_app_theme. |
| critique_ui | Deterministic critique for APPLICATION UI (dashboards, admin panels, SaaS views): runs the app-UI slop rulebook against React/JSX/HTML source (radius chaos, card-in-card, gray-on-gray text, raw palette classes, missing empty/loading/error states, clickable divs, killed focus rings) and, when a Standout app theme is installed, a theme-conformance pass (foreign colors, missing semantic token classes). Returns a 0-100 UI score with a ship verdict and a prioritized fix list. Use after building every view; re-run until the score clears 85. For marketing/landing PAGES use critique_design instead. |
| critique_design | Brutal, specific design critique of an existing page: automatic AI-slop detection (banned gradients, centered-hero defaults, h-screen bugs, cliche copy) plus a prioritized fix list with exact values. When you pass a URL, the response also includes LIVE SCREENSHOTS of the rendered page at phone (390px) and desktop (1440px) widths — look at them and fix what fails visually — and saves an unlisted SHAREABLE SCORE REPORT (score + category breakdown + screenshots) whose link you should give to the user. Always prefer passing the published URL over raw source for these reasons. |
| make_it_standout | THE master tool — one call to transform any site. Pass a url (or raw source, or just a business description) and Standout: (1) classifies the site type and locks the context, (2) scores it out of 100 across 8 categories with a client-ready bar at 85, (3) audits it for exact, prioritized fix patches, (4) gives it a creative spine + a reference-backed direction, (5) lays out the full-page composition, and (6) returns an LLM-ready prompt you can paste straight into Claude Code / Cursor / ChatGPT / Codex to apply everything, plus the MCP workflow and a re-audit checklist. Use this when the user just wants their page made client-ready and shouldn't have to know which individual Standout tool to call. |
| client_report | Generate a CLIENT-READY design audit report for an agency to send to its client: a Standout Score, what's holding the page back, what to fix and why it matters, a client-safe summary, and the page screenshots — all in plain language with NO internal jargon. Pass url for the current page; optionally pass after_url (or after_source) for a rebuilt version to get a true before/after with both screenshots and the score improvement. |
| get_section_code | Finished, art-directed HTML/CSS page sections for a design direction: nav, hero, offer, image band, story, and footer — composed by a designer, seeded to this business (accent + expression already applied). Use AFTER get_design_direction: assemble the sections and replace only the content (copy + images), never the composition. This is what makes the result look like a $10k site instead of a template. |
| get_hero_concept | Get a complete hero section concept: headline + subline copy (no marketing cliches), CTA labels, exact background treatment, and copy-paste ambient motion CSS matched to the design direction. |
| get_asset_pack | Ready-to-paste CSS for a direction: custom properties (palette + fonts), button/card/nav treatments, grain texture, Google Fonts import, and the matched motion recipe list. |
| get_showpiece | The tier ABOVE the design directions: finished showpiece skeletons for scene-led, art-directed pages - world hero with environment bleed, VIDEO world hero (looping cinematic clip + liquid-glass chrome + word-by-word blur reveals), type-scene interlock (mega type behind a cutout subject), monochrome flood, scene-pinned glass annotations, ghost mega-type band - each with the scene/video-generation prompts that make the world bespoke to THIS business, contrast scrims, mobile behavior and reduced-motion built in. Call with no technique to browse the menu (free); call with a technique id for the full skeleton. Use when the brief says wow, cinematic, premium beyond a normal landing page. |
| get_motion_recipes | Production-ready motion for any stack: CSS/vanilla-JS recipes (staggered entrances, scroll reveals, marquees, grain, parallax) PLUS finished shader-grade ambient pieces - WebGL gradient mesh, image ripple displacement, live halftone, velocity-reactive type rail, scroll-scrubbed zoom portal - palette-keyed to Standout directions. Request by ids or describe what you need; pass direction for palette-filled shader code. |
| get_premium_components | Standout-original premium primitives: luxury hero backgrounds, Framer-style dials/gauges, shader/glass cards, soft section transitions, proof rails, pricing plates, and headline motion. Returns copy-paste HTML/CSS/vanilla JS snippets with reduced-motion fallbacks. Use when the user asks for premium, luxury, beautiful, wavy, Framer-like, glass, 3D controls, or high-end motion. |
| assemble_premium_page | Assemble a coherent premium build kit from Standout-original primitives: type scale, spacing rhythm, hero background, card/surface, dial or metric, section transition, text motion, and proof/pricing. Use before building a luxury/high-end/Framer-like page so the agent has real components instead of generic advice. |
| search_references | Search Standout's curated reference library: real public-product style, screen, and component patterns with source URLs, color roles, layout notes, component rules, do/don't constraints, and agent implementation notes. Use before or during a build when you need evidence-backed visual patterns. |
| get_reference | Get the full structured payload for one reference: source URL, categories, tags, colors, typography, layout pattern, component rules, imagery, motion, do/don't constraints, and agent implementation notes. |
| get_similar_references | Find references similar to a known reference by shared tags, categories, use cases, and StandOut direction ids. Use after finding one strong reference to broaden the evidence set. |
| search_flows | Search reference-backed user journeys such as API key onboarding, pricing selection, hospitality booking, marketplace search, quickstart activation, and portfolio inquiry. Use when the page is part of a multi-step task, not just a visual screen. |
| get_flow | Get the full step-by-step payload for one user journey: problem, steps, user actions, system responses, related direction ids, and agent implementation notes. |
| synthesize_direction_from_references | Turn a business brief plus optional reference ids into a reference-backed build direction. Returns the chosen StandOut direction, matching public-product references, relevant flow patterns, a synthesized build plan, implementation lock, and next tool calls. Use when you want the agent to build from evidence instead of vibes. |
| build_from_reference | Reference-first build — 'show me what you like, I'll build it.' Give a reference you LIKE (a public site URL via reference_url, and/or a curated library id via reference_id from search_references) plus what YOU are building, and get back a matching StandOut direction, a reference-backed build plan, and the next call for section code. This is the front door for building from an EXAMPLE instead of a text brief: Standout reads the URL server-side for its semantic signal (title, headings, copy) and folds it into the direction match. Note: pixel-level palette/type extraction from an image is not yet supported (that is the Phase 2 vision pass) — for now it matches on the page's text/structure plus the curated library. Pass reference_id to anchor on an exact curated reference. |
| build_from_reference_v2 | Reference Intelligence Layer — build from a site you like without cloning it. Pass a public reference_url plus what YOU are building and optional favorite_bits such as 'hero animation', 'pricing card', or 'color mood'. Standout captures server-readable HTML/CSS signals, extracts Reference DNA, names what to borrow, names what to avoid, gives a similarity-risk guardrail, then returns a reference-backed original build direction. This is the right tool when the user says 'I like this site but don't want to steal it.' |
| critique_similarity | Originality guardrail — compare a built page/source/description against a reference site and flag shared recognizable fingerprints. Use after build_from_reference_v2, before showing or publishing, to avoid producing a design that is visually too close to the inspiration. |
| get_free_trial_key | Self-provision a free Standout trial key (25 calls, no signup) without leaving the conversation. Call this when no license key is configured or your Standout calls return a license error. Returns the key plus the exact reconnect instructions to hand your user. Free and unmetered; issuance is capped per network, so never call it when you already have a working key. |