Alpy MCP gives your AI tools a shared design system and 30+ design skills, including typography, responsive layouts, accessibility audits, and website design styles such as Bento Grid, Parallax, and Flat Design. Use it to create a product website, build a dashboard, or improve an existing page. Alpy provides React and Vue components, type scales, and semantic tokens for color, spacing, corner radius, border width, and shadow.

The skills guide how your AI arranges content, sizes headings, groups related elements, applies spacing and color, and adapts layouts to different screens. Your chosen website style adds specific direction for composition, imagery, textures, and visual details. Dedicated skills cover navigation, forms, motion, and accessibility checks.

Here’s how to get started:

1. Set up your library. Sign in and customize Alpy’s included fonts, colors, and components.

2. Connect Alpy MCP. Follow the setup guide https://alpymcp.com/ai-taste#ai-taste-install-title for Claude, Codex, Cursor, Gemini, or Figma Connector, then select your Alpy library.

3. Describe your idea and complete the brief. Your AI summarizes the completed brief.

4. Confirm and build. Confirm it before building begins.

For example:

"Create a landing page for [product name], an invoicing app for freelancers. Positioning: send invoices and track payments in one simple workspace. Sitemap: one page with hero, product preview, features, pricing, and FAQ. Main action: Start free."

Once you have a first version, ask for specific changes: turn the hero into an interactive product demo, arrange features in a bento grid, or reveal product details as visitors scroll. You can also use the audit skills to check an existing page’s mobile layout, keyboard navigation, and color contrast.