Landing Page Primary CTA Text Effects Components
- Updated on
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.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Color scheme gradient text
Color scheme gradient text
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Rainbow Gradient Text
Rainbow Gradient Text
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Soft Gradient Text
Soft Gradient Text
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Underline Text
Underline Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Underline Wave Text
Underline Wave Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Underline Dash Text
Underline Dash Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Line Gradient Text
Line Gradient Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Box Highlight Text
Box Highlight Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Inverted Box Highlight Text
Inverted Box Highlight Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Crooked Box Highlight Text
Crooked Box Highlight Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
Crooked Inverted Box Highlight Text
Crooked Inverted Box Highlight Text
This works with primary
, secondary
and Tailwind color schemes.
Grow your revenue
across multiple channels
Never miss that sale again. Get notified instantly when a customer buys something.
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