MCP Add-on Design Guide
Design guidelines for Alexa+ add-ons with an MCP server
Alexa+ is a multimodal conversational surface. Customers arrive by voice or touch, often multitasking, in kitchens, living rooms, and cars. They come to finish a task. Building a great add-on means meeting them in that moment. These guidelines cover the design language, rendering system, component patterns, and design best practices for Alexa+ MCP (Model Context Protocol) add-ons.
Why it matters
Great conversations make repeat customers. People return to experiences that just work, and skip the ones with friction. These guidelines help you understand how to build an MCP capable of effortless Alexa interactions.
Alexa+ is a different kind of surface. Typography, density, and interaction patterns that work on mobile don't translate directly to an Echo Show read at arm's length, or to a voice-only response on the go. Use these guidelines to make that translation.
Your design influences outcomes. MCP responses may include a visual and/or a spoken reply. You can't script what Alexa says, but you can design your data so Alexa's responses are rich, accurate, and useful. Understanding that model is the difference between a great conversation and a dead end.
In these guidelines
The big picture
How it works: Introduction to how customers will reach you, and what they expect when they arrive.
The conversation surface: Learn how your MCP tools shape what Alexa says, and what it means to design data for voice.
Display modes: Inline, fullscreen, and voice-only. Learn what each mode is designed for and how and when to use it.
Build a high-quality design
Layout and rendering: See how Alexa scales your UI across devices without you designing for each one.
Visual foundations: See the token system, scaling implementation, and color system for Alexa's surfaces. Author your UI once and scale it coherently.
Components and patterns: Learn about Alexa's interaction patterns and which pattern is best to implement for various use cases.
Brand expression: Learn where your logo appears, what assets to provide, and how to use your brand colors within Alexa's design system.
Get ready for customers
Accessibility: Learn the touch target minimums, contrast ratios, and on-device testing steps needed to meet accessibility requirements.
Testing your add-on CX: Learn how to test for high-quality customer experience, and what to watch for before you submit for certification.
Store listing: Your store listing may be the first thing a potential customer sees. Write a tagline, description, and sample utterances to drive discovery and set accurate expectations.
Glossary: Definitions of terms used throughout these guidelines.
Next: Introduction
Last updated: Jul 21, 2026
