A collection of text effects for the primary CTA section. These are meant to be used together with LandingPrimaryImageCtaSection, LandingPrimaryTextCtaSection and LandingPrimaryVideoCtaSection, as part of the titleComponent prop.

On a landing page, they can be used to emphasize parts of the CTA title and increase conversion rates.

There are not components per say, but a collection of patterns using Tailwind CSS effects and text effects.

Monochrome Gradient Text

Monochrome Gradient Text
This works with primary, secondary and Tailwind color schemes.

Color scheme gradient text

Color scheme gradient text

Rainbow Gradient Text

Rainbow Gradient Text

Soft Gradient Text

Soft Gradient Text

Underline Text

Underline Text
This works with primary, secondary and Tailwind color schemes.

Underline Wave Text

Underline Wave Text
This works with primary, secondary and Tailwind color schemes.

Underline Dash Text

Underline Dash Text
This works with primary, secondary and Tailwind color schemes.

Line Gradient Text

Line Gradient Text
This works with primary, secondary and Tailwind color schemes.

Box Highlight Text

Box Highlight Text
This works with primary, secondary and Tailwind color schemes.

Inverted Box Highlight Text

Inverted Box Highlight Text
This works with primary, secondary and Tailwind color schemes.

Crooked Box Highlight Text

Crooked Box Highlight Text
This works with primary, secondary and Tailwind color schemes.

Crooked Inverted Box Highlight Text

Crooked Inverted Box Highlight Text
This works with primary, secondary and Tailwind color schemes.

More Examples

For more even more examples, see our Landing Page Component Examples page or see complete landing page examples by Exploring Our Landing Page Templates.

Also see:

• Primary Image Call to Action component for the main CTA integration
• Primary Text Call to Action component for text-focused CTAs
• Primary Video Call to Action component for video-based CTAs