Overview
How might we design slash commands so people can trust and act on AI output?
When this pattern fits
- Perfect for IDEs, productivity tools, and developer environments where power users need quick keyboard-first access to AI models, templates, and actions.
When to skip or lighten it
- Consumer surfaces where most users never learn command syntax and would never discover the feature.
- Products with very few actions, where a visible button is faster to find than a hidden command.
- Mobile-first composers where a slash menu competes with the on-screen keyboard for space.
States
State model coming soon
Key UX elements
Key UX elements coming soon
Anti-patterns to avoid
No visible hint that "/" does anything, leaving the feature undiscoverable.
Commands with cryptic names and no description or preview of what they do.
Slash menu and a separate "+" menu offering overlapping actions with no shared mental model.
Breaking normal typing when a message legitimately starts with a "/" character.
How products use it
| Product | Implementation |
|---|---|
| Slack | Slash commands trigger integrations and actions like /remind or /poll from the message box. |
| Notion | Typing "/" opens a block-type and AI-action menu inline in the document. |
| Discord | Slash commands expose bot and app actions with argument autocomplete. |
| Midjourney | Slash commands like /imagine and /blend are the primary way to invoke generation. |
Implementation
Copy this prompt to generate a production-ready implementation in Cursor, Claude Code, Lovable, or any AI coding agent.
Generate a production-ready implementation of the "Slash Commands" AI interface design pattern.
Pattern Definition:Frequently asked questions
What are slash commands in AI chat interfaces?
Slash commands let users type "/" in a chat or composer input to open a menu of quick actions, templates, or model switches, then select one with the keyboard instead of hunting through a settings menu.
Are slash commands only useful for power users?
Mostly yes. Slash commands reward users who already know the vocabulary of available actions, so they work best as an accelerator layered on top of discoverable buttons, not as the only way to reach a feature.
How is a slash command different from an @ mention?
Slash commands invoke actions or templates; @ mentions reference context like files, people, or agents. Some products use both in the same composer, so distinct trigger characters and menu styling help users tell them apart.