Skip to main content
The Prompt component displays a pre-built AI prompt with one-click actions to copy it to the clipboard or open it directly in Cursor. It’s ideal for any docs page where you want to hand readers a ready-to-use prompt.

Basic usage

Summarize this API endpoint

<Prompt description="Summarize this API endpoint">
You are a technical writer. Given the following API endpoint documentation,
write a one-paragraph summary that explains what the endpoint does, what
inputs it requires, and what it returns. Be concise and use plain language.
</Prompt>

With Cursor integration

Add actions={["copy", "cursor"]} to also surface an “Open in Cursor” button. This is especially useful for prompts readers will use in their editor.

Generate a typed API client

CursorOpen in Cursor
<Prompt
  description="Generate a typed API client"
  icon="code"
  actions={["copy", "cursor"]}
>
You are an expert TypeScript developer. Given the following OpenAPI
specification, generate a fully-typed API client using native fetch...
</Prompt>

Props

description
string
required
Heading text shown above the prompt content. Supports Markdown.
children
string
required
The prompt text that gets copied or sent to Cursor.
actions
array
Which action buttons to show. Options: "copy", "cursor". Defaults to ["copy"].
icon
string
An icon displayed alongside the description. Supports Font Awesome, Lucide, and Tabler icon names, image URLs, or inline SVG.

When to use it

The Prompt component works well anywhere you’re teaching readers to work with AI:
  • Quickstart guides — give readers a prompt to generate their first integration
  • API reference pages — include a prompt for generating client code from the spec
  • Troubleshooting guides — embed a debugging prompt readers can run against their own error logs
  • Conceptual pages — add a prompt for exploring the topic further with an AI assistant