← All components AI affordances

EmptyStateCards

Starter-prompt grid every great chat shows on first open. Eyebrow + title + 3-4 ghost cards with example prompts.

Inspired by ChatGPT, Claude.ai, Perplexity blank-state cards.

Preview

What it looks like.

New conversation

What would you like to do?

Pick one of the starter prompts, or just start typing below.

Usage

Drop it into your app.

import { EmptyStateCards } from '@locara/components'

<EmptyStateCards
  eyebrow="New conversation"
  title="What would you like to do?"
  subtitle="Pick a starter prompt, or just start typing."
  cards={[
    { prompt: 'Summarise the last meeting', hint: 'Granola transcript · 12 min' },
    { prompt: 'Find papers on KV cache quantization', hint: 'Searches your local PDF library' },
    { prompt: 'Draft a release note from the changelog', hint: 'Reads .md · writes prose' },
    { prompt: 'Explain this code file', hint: 'Uses a 3B coder model' },
  ]}
  onCardClick={(c) => composer.fill(c.prompt)}
/>

Or copy the source into your repo: locara add empty-state-cards