CTA group

Primary (green filled) and secondary (outlined) button pair. External links open in new tabs.

5 tokens

Preview

Usage

import { CtaGroup } from '@/components/marketing/cta-group'

<CtaGroup
  primaryText="Try the demo"
  primaryHref="/demo"
  secondaryText="Register your school"
  secondaryHref="/register"
/>

Tokens used

This component reads these tokens directly: change one on a Foundations page and it updates here and across the site.

Accent--ds-accent

#00F15E

CTA height--ds-btn-h

2.75rem

CTA padding X--ds-btn-px

1.5rem

CTA radius--ds-btn-radius

9999px

CTA font weight--ds-btn-weight

500