CTA

The CTA (Call to Action) component is designed to drive user conversions at the end of a page or section.

Usage

import CTA from '~/components/sections/CTA.astro';

<CTA 
  title="Ready to get started?"
  description="Join thousands of happy users today."
  primaryBtnText="Sign Up"
  primaryBtnLink="/signup"
  secondaryBtnText="Learn More"
  secondaryBtnLink="/about"
/>

Variants

Default

The default variant occupies the full width with a prominent background glow.

Build faster today

Stop wasting time on boilerplate. Use our templates to ship your next project in record time.

指定リンクからASTROに登録する 登録したIDを申請する

※ 本サイトはシミュレーター機能の提供を目的としています。実際の取引はリスクを伴うため自己責任で行ってください。18歳未満の方はご利用いただけません。

Boxed

The boxed variant is contained within a card, useful for placing inside other layouts.

Ready to Launch?

Get started with our premium templates.

指定リンクからASTROに登録する 登録したIDを申請する

Props

| Prop | Type | Default | Description | | :--- | :--- | :--- | :--- | | variant | 'default' \| 'boxed' | 'default' | Layout style of the section. | | title | string | undefined | Heading text. | | description | string | undefined | Subtext description. | | primaryBtnText | string | undefined | Text for the primary button. | | primaryBtnLink | string | undefined | URL for the primary button. | | secondaryBtnText | string | undefined | Text for the secondary button. | | secondaryBtnLink | string | undefined | URL for the secondary button. |