Create marketing funnels in minutes!

Your page? Unpause your account to remove this banner.

Learn more

🎊 CFDesignHacks Launch Special | $0 FREE Unlimited 14-Day Trial 🎊

CLICKFUNNELS DESIGN HACKS

20+ Design Hacks to boost your conversions

Hook your visitors attention. Bring a smile to their face. Build trust.
Compatible with CF 2.0 and CF Classic.
Made for Clickfunnels with ♡

USED BY AGENCIES & FUNNEL BUILDERS AT:

WATCH THE VIDEO

Feeling limited by Clickfunnels Design Capabilities?
Yah, me too.

That's why I created CF Design Hacks

CLICKFUNNELS DESIGNHACKS

Our achievements

200+

Agencies & Funnel Builders

These effects have been used by over 200+ funnel agencies and builders alike.

153%

increase in page time visit

When using our design hacks the duration that people stay on the page increases by a factor of 1.5x according to Google Analytics

9+

Years Funnel Design Experience

We've built funnels for clients for over 9 years now and we've found what bridges the gap between trust and no-trust from a design standpoint.

ABOUT

What is CF Design Hacks?

CFDesignHacks is a copy-paste library of CSS and JS snippets to bring your funnel ALIVE. Our effects library is packed with beauty and intention to convert. When we create something, we put in the time, Love and dedication required to make something epic. And people can feel it. We hope you do, too :)

Copy-Paste Design Hacks Library

Compatible with CF 2.0 and CF Classic

Easy-to-follow Tutorials

MEET THE FOUNDER

Who's behind CF Design Hacks?

What's up beautiful people, my name is Christian and I am the founder of CFDesignHacks and Lovepixel Agency.
At our agency we've had the honor and joyto create sites and funnels for some of the biggest names in the conscious entrepreneurship space.

We mainly work with coaches, speakers, authors and influencers to maximize their branding and conversion - a big part of that is animation/micro interactions to keep visitors engaged while scrolling the site/funnel.

I felt always restricted by the design capabilities of Clickfunnels so I decided to create this little copy-paste CSS/JS library over the years and share it with the world, hence CFDesignHacks was born.

BRING YOUR FUNNELS ALIVE

Explore CF Design Hacks

01

Animated Text Effects

Animated Rotating Headline/Text

You also might know this as typewriter effect.
Let this Animated Background Gradient bring
your Sales Page / Thank you Page / Optin Page
etc. to life.

Typing Effect Features
​• Delay the time/speed of typing effect and backspacing
• ​Enable/Disable looping effect
​• Change the color of typing font
​• Change the color of the backspace

Animated Gradient
Text Mask

ANIMATED
GRADIENT TEXT

You need some extra bit of animation on your headline, text elements? We got you covered. 

Customization Features
• customize speed and gradient of animation
• apply on any text on page
(headline, paragraph, bullet etc.)

Animated Gradient Divider

EXAMPLE:

Add a touch of flair to your page with the Animated Gradient Divider. It's like a colorful line that moves and changes colors. Use it to separate sections and add a dynamic twist to your design!


Divider Customization Features
• customize width and height
• customize speed and angle of gradient animation

Animated GIF
Text Mask

GIF TEXT
MASK

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vulputate laoreet nulla sed rhoncus nisl tincidunt
eu. Fusce sit amet nisl non est vestibulum aliquet. Aliquam
gravida, velit quis pulvinar placerat.


GIF Text Mask Customization Features
• comes with 9 GIFs pre-chosen for best appearance

02

Animated Background Effects

Animated Background
Gradient

Let this Animated Background Gradient bring
your Sales Page / Thank you Page / Optin Page
etc. to life.

Gradient library included
• over 80+ pre made Gradients included

Gradient library included
• over 80+ pre made Gradients included

Animated Polygon
Background

This Animated Polygon Background adds animated geometry shapes to section that responses to mouse movements (interactivity can also be disabled).

Polygon features
    • Customize size. density, number of
       polygons
    • Customize color
    • Customize interactivity

Animated Particle
Background

This Animated Particle Effect adds particle shapes to any section in Clickfunnels that responses to mouse movements . this options can be applied over any kind of background Highly customizable.

Particle features
• customize interactivity
nodes (triangle, circle. star etc.)
• customize color of lines, shape of
• customize size density, opactiy

Animated Triangle Background

Similar to the Particle Effect, this Animated Triangle Effect makes your Clickfunnels pages shine with animated triangles.

Triangle features
    • Customize size, speed, opactiy
    • Customize color ​of lines & shape

Animated Confetti
Background

This Premium Effect is the Animated Confetti Background. This is especially helpful for Thank you / Success Pages. Make your buyer feel rewarded & awed at the same time.

Confetti features
• Customize density & number of confetti
• Customize color

03

Section Transitions

Centered Section Transition

You also get access to 4 Premium Section Transitions to make your Funnel look epic. This is number #1. These transitions were specifically designed for Clickfunnels to increase conversion & usability.

Section features
• customize size & angle

Diagonal Section Transition

This is number #2. Perfect for those who want to look different than the rest. These transitions were specifically designed for Clickfunnels & can be used right away on any funnel page you have.

Section features
    • Customize size & angle

Asymmetric Section Transition

This is number #3. Perfect for those who want to stick out – ideal for bold brands. These transitions were specifically designed for Clickfunnels & can be used right away on any funnel page you have.

Section features
• customize size & angle

Rounded Section Transition

This is number #4. Perfect for harmonious branding & forms – ideal for Life Coaches etc. These transitions were specifically designed for Clickfunnels & can be used right away on any funnel page you have.

Section features
    • Customize size & angle

04

Button Effects

Animated Gradient Button

ANIMATED
GRADIENT BUTTON

Make your buttons pop with the Animated Gradient Button. It changes colors as you hover over it, adding a fun touch to your page. Great for encouraging clicks!

Customization Features
• Animation Speed
• Gradient Colors
• Gradient Angle

Animated Shiny
Button

ANIMATED
SHINY BUTTON

The Animated Shiny Button is like a shiny gem on your page. It sparkles as you move your cursor, giving your website a polished and fancy feel.

Customization Features
• Change colors of shiny effect
• Animation Speed

Animated Gradient Button

ANIMATED
GRADIENT BUTTON

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vulputate laoreet nulla sed rhoncus nisl tincidunt
eu. Fusce sit amet nisl non est vestibulum aliquet. Aliquam
gravida, velit quis pulvinar placerat.

Lorem Ipsum
• Lorem ipsum dolor sit amet, consectetur` adipiscing elit.

Animated Shiny
Button

ANIMATED
SHINY BUTTON

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vulputate laoreet nulla sed rhoncus nisl tincidunt
eu. Fusce sit amet nisl non est vestibulum aliquet. Aliquam
gravida, velit quis pulvinar placerat.

• Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem Ipsum

Animated Pulsing
Button

ANIMATED
PULSING BUTTON

When you use the Animated Pulsing Button, it's like your button is breathing. It gets bigger and smaller gently, catching attention and guiding clicks.

Customization Features
• Pulsing speed/intensity
• Change colors

Gradient Outline
Button

GRADIENT
OUTLINE BUTTON

With the Gradient Outline Button, your buttons have a cool outline that fills with color when you hover. It's sleek and modern, perfect for a stylish look.

Customization Features
• change gradient color
• different hover background colors

Animated Pulsing
button

ANIMATED
PULSING BUTTON

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vulputate laoreet nulla sed rhoncus nisl tincidunt
eu. Fusce sit amet nisl non est vestibulum aliquet. Aliquam
gravida, velit quis pulvinar placerat.

Lorem Ipsum
• Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Gradient Outline
Button

GRADIENT
OUTLINE BUTTON

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vulputate laoreet nulla sed rhoncus nisl tincidunt
eu. Fusce sit amet nisl non est vestibulum aliquet. Aliquam
gravida, velit quis pulvinar placerat.

• Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem Ipsum

Animated Sliced
Button

ANIMATED
SLICED BUTTON

Try the Animated Sliced Button for a unique twist. It's like a puzzle piece that moves when you touch it. It's a fun way to make your buttons interactive!

Customization Features

• Change tilt/angle of slice effect
• Change hover effect of button

Animated Sliced
Button

ANIMATED
SLICED BUTTON

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Integer vulputate laoreet nulla sed rhoncus nisl tincidunt
eu. Fusce sit amet nisl non est vestibulum aliquet. Aliquam
gravida, velit quis pulvinar placerat.

Lorem Ipsum
• Lorem ipsum dolor sit amet, consectetur adipiscing elit.

05

Content Effects

FAQ Accordion/Toggle Module

Finally an FAQ Accordion/Toggle Module inside of Clickfunnels. It hides answers until you click, keeping things neat. It's perfect for sharing info without overwhelming your page.

Lorem Ipsum
• Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Animated LIVE-Stream Icon

The Animated LIVE-Stream Icon is a little icon that moves indicating that you're aLIVE. It's like a virtual "On Air" sign. Viewers will know you're streaming / have an (inter)active brand.

• Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem Ipsum

Simple Pricing

MONTHLY MEMBERSHIP

$0

14 Day Free Trial, after that: 17/mo

  • ​Immediate Access to CF Design Hacks Copy-Paste Library of 20+ Effects and upcoming CSS/JS snippets in the development pipeline
  • ​Access to all Tutorial Videos
  • ​Access to Growing Library of Exclusive Design Add-ons / Extensions / Tutorials for ClickFunnels
  • ​BONUS: 8 Black Matte Device Mockups
  • ​BONUS: Access to Gradient Library

cancel anytime from your account backend

LIFETIME MEMBERSHIP

$297

one-time

  • ​LIFETIME Access to CF Design Hacks Copy-Paste Library of 20+ Effects and upcoming CSS/JS snippets in the development pipeline
  • ​Access to all Tutorial Videos
  • ​Access to Growing Library of Exclusive Design Add-ons / Extensions / Tutorials for ClickFunnels
  • ​BONUS: 8 Black Matte Device Mockups
  • ​BONUS: Access to Gradient Library

available for limited time during launch phase

FREE 14 DAY TRIAL

We are confident that our effects will bring you increased conversion. If for some reason, you change your mind, just cancel from your account backend or reach out to us for help at info@cfdesignhacks.com

EXCLUSIVE BONUSES

Wait, there is more...

8 Matte Device Mockups

You get Lifetime Access to 8 Free Black Matte
Devices Mockups for Personal and
Commercial projects for your funnel designs.

- 8 Matte Black Mockups
- Photoshop use

Gradient Library

Additionally you get immediate access to my favorite collection of Gradient Libraries
that can easily be used right away on any Clickfunnels funnel page you have.

- 80+ effects available
- Copy-Paste HexCode if desired
- Filter gradients by mood / color
(perfect for already existing brand / funnel)
- Rotate angles
- Download as JPEG/PNG for Clickfunnels Background Image

TESTIMONIALS

What others say

REASONS

Why use our

DESIGNS HACKS

besides the fact that they look incredible 🤩

✅

No Photoshop skills required

✅

No Design Skills required

✅

HOW TO Tutorials included

REASONS

Why use our

DESIGNS HACKS

besides the fact that they look incredible 🤩

✅

No Photoshop skills required

✅

No Design Skills required

✅

HOW TO Tutorials included

FAQs

Have more questions?
Reach out to us at info@cfdesignhacks.com

FREQUENTLY ASKED QUESTIONS

FAQs

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vulputate laoreet nulla,
sed rhoncus nisl tincidunt eu. 

GET STARTED

How it works

Step 1

Love what you see?
Great, me too!

Step 2

Pick your plan - monthly or lifetime - and go to checkout.

Step 3

Get immediate access to CFDesignHacks.

EPIC funnels
for you

EPIC funnels
for you

Simple Pricing

MONTHLY MEMBERSHIP

$0

14 Day Free Trial, after that: 17/mo

  • ​Immediate Access to CF Design Hacks Copy-Paste Library of 20+ Effects and upcoming CSS/JS snippets in the development pipeline
  • ​Access to all Tutorial Videos
  • ​Access to Growing Library of Exclusive Design Add-ons / Extensions / Tutorials for ClickFunnels
  • ​BONUS: 8 Black Matte Device Mockups
  • ​BONUS: Access to Gradient Library

cancel anytime from your account backend

LIFETIME MEMBERSHIP

$297

one-time

  • ​LIFETIME Access to CF Design Hacks Copy-Paste Library of 20+ Effects and upcoming CSS/JS snippets in the development pipeline
  • ​Access to all Tutorial Videos
  • ​Access to Growing Library of Exclusive Design Add-ons / Extensions / Tutorials for ClickFunnels
  • ​BONUS: 8 Black Matte Device Mockups
  • ​BONUS: Access to Gradient Library

available for limited time during launch phase

Make your funnel EPIC with these exclusively curated Clickfunnels Design Hacks.

Links

Pricing | Member Login

Need help?
info@cfdesignhacks.com

DISCLAIMER - This site is NOT part of FACEBOOK or CLICKFUNNELS or associated with FACEBOOK or CLICKFUNNELS.

© 2023+ CF Design Hacks I All rights reserved I Privacy Policy I Terms of Service I Refund & Return Policy