About 5 min read

Smart Cards

Smart Cards are structured, interactive components that appear within AI responses. Instead of plain text, Karma One renders rich visual cards for certain types of information, making results easier to read, interact with, and act upon.

What Are Smart Cards?

When the AI retrieves or generates structured data -- such as search results, stock quotes, weather forecasts, or code output -- it presents the information as a Smart Card rather than raw text. Each card type is designed for its specific content, with appropriate formatting, icons, and interaction options.

Smart Cards are not just visual decoration. They provide:

  • At-a-glance information with key data points highlighted
  • Interactive elements like links, buttons, and expandable sections
  • Consistent formatting that is easier to scan than unformatted text
  • Actions you can take directly from the card

Card Types

Search Result Cards

Displayed when the AI performs a web search. Each card shows:

| Element | Description | |---------|-------------| | Title | Clickable link to the source page | | Domain | The website's domain with favicon | | Snippet | Relevant excerpt from the page | | Date | Publication or last-updated date (when available) |

Multiple search result cards appear in a scrollable list, making it easy to browse through all sources.

Stock Quote Cards

Triggered when you ask about stock prices or market data:

"What's Apple's stock price?"
"How is TSLA doing today?"

The card displays:

| Element | Description | |---------|-------------| | Ticker & Company | Symbol and full company name | | Current Price | Latest available price | | Change | Price change and percentage (green for up, red for down) | | Chart | Mini price trend graph | | Key Metrics | Market cap, volume, P/E ratio, 52-week range |

Weather Cards

Displayed for weather-related queries:

"What's the weather in Tokyo?"
"Will it rain in London tomorrow?"

The card includes:

| Element | Description | |---------|-------------| | Location | City and country | | Temperature | Current temperature with high/low range | | Condition | Weather icon and description (sunny, cloudy, rain, etc.) | | Forecast | Multi-day outlook when applicable | | Details | Humidity, wind speed, UV index |

Code Execution Result Cards

When the AI runs code in the sandbox, results are presented in structured cards:

| Element | Description | |---------|-------------| | Code Block | The executed code with syntax highlighting | | Output | Standard output from the execution | | Charts/Images | Rendered visualizations (matplotlib, plotly, etc.) | | Errors | Error messages with traceback (when applicable) | | Status | Execution success or failure indicator |

Tip: You can ask the AI to re-run modified code directly from the card context.

Image Generation Cards

When the AI generates an image, it appears as a card with:

| Element | Description | |---------|-------------| | Image Preview | The generated image at display resolution | | Prompt | The description used to generate the image | | Metadata | Aspect ratio, resolution, model used | | Actions | Download, regenerate, or request modifications |

Schedule and Reminder Cards

When you create a reminder or scheduled task, a confirmation card appears:

| Element | Description | |---------|-------------| | Task | What you will be reminded about | | Time | When the reminder is set for | | Recurrence | One-time or recurring pattern | | Status | Active, completed, or canceled |

Knowledge Base Result Cards

When the AI retrieves information from your knowledge bases, results are shown as cards with:

| Element | Description | |---------|-------------| | Source File | The document the information came from | | Knowledge Base | Which knowledge base was searched | | Excerpt | The relevant passage | | Relevance | How closely the result matches your query |

Card Interactions

Smart Cards support several interaction patterns:

Tap / Click

Tap a card to view more details or follow a link. For search result cards, this opens the source URL. For other cards, it may expand the card to show additional information.

Expand / Collapse

Some cards have expandable sections. For example, a stock quote card might show basic info by default but expand to reveal detailed metrics, historical data, or analyst ratings.

Share

Long-press or use the share icon on a card to share its content:

  • Copy the card's text content to your clipboard
  • Share as an image
  • Forward to another conversation

Download

Cards containing generated content (images, charts, documents) include a download action to save the file to your device.

Regenerate

For generated content (images, code output), you can request a new version directly from the card without retyping your prompt.

When Cards Appear

Smart Cards appear automatically based on the type of response. You do not need to request them. However, you can influence whether cards appear:

"Show me Apple's stock price."          --> Stock card appears
"Tell me Apple's stock price in text."  --> Plain text response

The AI infers the best presentation format, but you can always ask for a specific format if you prefer.

Cards on Different Platforms

Smart Cards are designed to work across all Karma One platforms:

| Platform | Card Rendering | |----------|---------------| | iOS App | Native card components with full interactivity | | Android App | Native card components with full interactivity | | Web App | HTML/CSS card components | | Telegram | Simplified card format (text with inline links) |

Note: On platforms with limited rendering capabilities (e.g., Telegram), cards are automatically degraded to rich text while preserving all essential information.

Best Practices

  • Let cards do the work. Instead of asking for raw data, let the AI present it as a card. The structured format is faster to read and easier to act on.
  • Use card actions. Tap, expand, and download directly from cards rather than asking the AI to repeat information in a different format.
  • Combine with follow-ups. After seeing a stock card, you can ask "Compare this with Microsoft" and the AI will present both side by side.
  • Share cards for collaboration. Use the share action to send structured information to colleagues without copy-pasting.