CTA-02
Untriaged Channel chooser
For readers who are ready but have a preference about how they get in touch. Each channel states what it is best for and how fast the reply is.
Use it when
For readers who are ready but have a preference about how they get in touch. Each channel states what it is best for and how fast the reply is.
- Category
- Calls to action
- Layout archetype
- Ruled sequence
- Page position
- closing (derived)
- Purpose
- convert (derived)
- Field
- light (derived)
- Interaction
- static (derived)
- Motifs
- Held column, Quiet field
Content it requires
- Three channels with a use case, a response expectation, and a real destination
Do not use it when
- The response times are a public promise. Do not publish one you cannot keep.
- Not a page closer. Use it on contact and FAQ pages, then close with CTA-01.
Variants
None. Colour swaps and mirrored alignment do not count as variants.
Implementation
src/components/patterns/CtaChannelChooser.astro
---
import CtaChannelChooser from '../components/patterns/CtaChannelChooser.astro';
---
<CtaChannelChooser /> Import directly. Do not route production through patternComponents.
Production usage
Not yet used on a production page. Nothing here has been proven in front of a customer.
Accessibility
- Verified at 360, 768, 1024, and 1440 with no horizontal overflow.
- No interactive controls beyond links and buttons inherited from the design system.
- Colour never carries meaning alone: every state marker is paired with text.
- Motion respects prefers-reduced-motion.