Components Context Management Context Pills
CM02 · Context

Context Pills

Purpose Compact UI tokens showing active context inputs inline. Lets users see at a glance what's in scope without leaving the interface.
Use when Space is constrained and a full context sources panel (CM01) would be too heavy. Context pills appear inline — in the prompt area, beneath a response, or in a conversation header — to indicate what the AI is drawing from.
Do not use As a replacement for CM01 in contexts where the user needs full source detail. Pills are summaries. When the user needs to inspect or modify sources, surface the full panel.
Failure mode prevented Users submit prompts without realizing the AI has stale, irrelevant, or incomplete context attached. Context pills surface scope at the moment of interaction — before it affects the response.
Example Dark Academia
Dark Academia
The Atelier
Neon Tide
The Archive
Candlelight
The Conservatory

Analyze the pipeline failures and suggest root causes for each connector…

Using:
Q1-errors.csv Salesforce Live Query incident-template.md (partial) Session memory pipeline_audit.py
context-pills-static — read-only pills showing what is in scopecontext-pills-removable — pills with an ✕ to remove that context from scopecontext-pills-addable — includes an add button for attaching additional context
Design rule

Context pills must reflect the actual scope of the AI's current session — not a wishlist of available integrations. Inactive sources are not shown as pills. Showing an inactive source as a greyed-out pill is acceptable only if removing or adding it has immediate effect.

Override these CSS custom properties to apply your own visual treatment without touching the component's behavioral contracts.

Shared semantic tokens

Token Controls
--rad-border-subtle Fallback border
--rad-color-text-primary Add button hover text
--rad-color-text-meta "Using:" label
--rad-color-approve Focus ring color
--rad-radius-card Fallback border radius

Component-scoped tokens

Token Controls
--rad-context-pill-bg Active pill background
--rad-context-pill-border Active pill border
--rad-context-pill-color Active pill text
--rad-context-pill-remove-color Remove button default
--rad-context-pill-remove-hover Remove button hover
--rad-context-pill-partial-bg Partial pill background
--rad-context-pill-partial-border Partial pill border
--rad-context-pill-partial-color Partial pill text
--rad-context-pill-add-color Add button text
--rad-context-pill-add-border Add button border

"*Context pills are the difference between a prompt box and a scoped instruction — they show the AI what it is working with.*"

← Previous Context Sources Next → Active Memory Panel

Intellectual Property

RAD is the original work of Jackie Curry. All rights reserved. No portion may be reproduced, adapted, or incorporated into any product or system without express written permission.

Permitted: citation in academic or editorial contexts with full attribution.

Licensing

© 2025 Jackie Curry. All rights reserved. Publication date: 2025.

For licensing inquiries, connect on LinkedIn →