Build websiteswith your AI agents,add taste with Alpy MCP.

Alpy gives AI a design system and a creative director companion, so every design feels consistently yours. Customize your Alpy Library’s type, color, and tokens, which keeps everything in sync across Alpy MCP, Figma, React, and Vue.

https://www.thealpy.studio/api/alpy-mcp

Not sure how to set it up? Set up guide

Everything you need to build beautiful and consistent UI.

AI tools can create polished interfaces in seconds, but without your design system, they are still guessing. Give agents your approved components, tokens, styles, skills, and live library context so every output stays true to your source of truth.

Explore Alpy MCP

  1. Color Palettes

    Choose a color profile and contrast model, then generate and fine-tune an accessible palette. Your library colors and component styles stay automatically in sync.

    • Accessible
    • Bound to semantic tokens

  2. Typography

    Choose fonts, base size, ratio, steps, and spacing. Your library typography and component styles stay automatically in sync.

    • Responsive
    • Bound to tokens

  3. Components

    Use 23 accessible components with canonical variants, token bindings, runtime behavior, and light and dark modes.

    • 23 Components
    • Canonical
    • Token Bindings

  4. AI Taste

    Choose a visual direction and help AI agents create or polish better websites and interfaces using 20+ web design styles, 30+ UI skills, and your Alpy Library context.

    • Visual Direction
    • Define to Review
    • Agent Guidance

  5. AI Skills

    Install all 45 registered AI workflows and style profiles for design intent, website design, front-end work, responsive adaptation, and accessibility.

    • 45 Skills
    • Design
    • UX
    • Audit

  6. UX Guidelines

    Guide agents with product direction, governance, brand, composition, content, inclusive UX, visual principles, and accessibility.

    • Accessibility
    • Governance
    • Composition

  7. Tech Stacks

    Use React, Vue, Alpy MCP, the Figma plugin, Alpy Connect, JSON, CSS, and command-line install paths.

    • React
    • Vue
    • MCP
    • CLI
    • Figma

One flow from zero to ready.

A tool for colors. Another for type scale. Another for components. Another for Figma. Another for Codex or Claude.

Alpy brings scattered workflows into one synced flow, from setup to shipping.

A component library you need to build websites.

Accordion
Alert
Badge
Breadcrumbs
Button
Card
Checkbox
Date Picker
Dropdown
Icons
Image
Modal
Pagination
Popover
Progress Bar
Progress Indicator
Radio
Table
Tabs
Text Input
Textarea
Toggle
Tooltip

User Experience, Accessibility Audit, Website Design, UI Design, Front-end design, Responsive Adaptation

The source of truth and design taste for AI code agents. Ready.

Connect your Alpy MCP to Claude, Codex, Cursor, and Figma in a few clicks, so every AI agent works from the same source of truth.

Explore Alpy MCPExplore Alpy Taste

Give every website a clear visual direction

Explore 24 Alpy web design style skills, including Bauhaus, Bento Grid, Flat Design, Modern Dark, Parallax and more, to guide AI agents on layout, typography, color, interaction, and art direction before they write a line of code.

Explore 20 Web Design Skills

How Alpy Works

Polish or redesign websites and UIs through Alpy MCP, insert components with Alpy Figma Connector, and build with production-ready React or Vue components.

Design taste for AI agents

Open AI Taste, choose the design guidance for your task, and give your agent the relevant design, website, front-end, responsive, and accessibility context from the same source of truth.

Explore Alpy Taste

Pricing

Try Alpy Library for free. Use your Alpy Library with Install Code, AI Skills, Alpy MCP, and the Alpy Figma plugin, or choose Enterprise for unlimited libraries and library switching.

  • Free

    Start here

    Customize your Alpy Library with your type, colors, tokens, and component styles, then preview the results locally.

    $0always

    Included

    • 1 design system
    • Type Scale Generator
    • Palette Generator
    • Light + Dark themes
    • Component demo
    • Token management
    • A11y audit
    • Automated documentation
    • Alpy MCP
    • 45 AI design skills
    • React component preview
    • Vue component preview

    Limits

    • Browser-local save
    • No downloads
    • No Figma plugin package
    Try for Free

  • Pro

    1 library

    Use your Alpy Library in production with Install Code, AI Skills, Alpy MCP, and the Alpy Figma plugin.

    $49First library on Alpy

    Everything in Free, plus

    • 1 design system
    • 45 AI design skills
    • React component install
    • Vue component install
    • Alpy MCP server
    • Figma plugin
    • E-mail support

    Limits

    • No extra design systems
    • No library switching

  • Enterprise

    Unlimited

    Create and switch between unlimited libraries for brands and client work.

    $490Lifetime accessOne-time payment

    Everything in Pro

    • Unlimited design systems
    • Switch between libraries
    • 45 AI design skills
    • Priority support and onboarding
CapabilityFreeProEnterprise
Design systems11Unlimited
Type scale generatorYesYesYes
Palette generatorYesYesYes
ThemesLight + DarkLight + DarkLight + Dark
Token managementYesYesYes
Component demoYesYesYes
Automated documentationYesYesYes
A11y auditYesYesYes
AI context
Alpy MCPYesYesYes
AI design skills454545
Code and Figma
ReactPreviewCode exportCode export
VuePreviewCode exportCode export
Alpy library for Figma pluginNoYesYes
Limits
Save and downloadsBrowser-localDownloads includedDownloads included
Extra design systemsNoNoUnlimited
Library switchingNoNoYes
Team
SupportE-mailE-mailPriority support

Questions? Answers!

Need further help or personalized assistance? Reach out to us and we will help you choose the right Alpy license for your workflow.

Build with your AI agents, add taste with Alpy.

Bring your Alpy design system into Claude, Codex, Gemini, and Figma.

Build everywhere with the same AI skills, tokens, components, and design guidance.