Skip to main content
Add Button Hover States

How to add a hover state to buttons

Felix Higgs avatar
Written by Felix Higgs
Updated over 3 weeks ago

This feature is currently in Alpha Testing. If you would like to participate in Alpha Testing, please reach out to tiffany@knak.com.

Knak has a built-in functionality to easily add hover states to button. This can be a great way to draw attention to important content and CTAs.

How to add a hover state

  • Drag a button element from the content bar to your asset.

  • Click on the button to reveal the content attributes in the right navigation.

  • Toggle on 'Use Hover Effects'.

  • You can now customize the text and button background color.

  • You can view the effect by previewing the email in Knak and hovering your cursor over the button.

  • A transition of 0.2s is automatically applied by default.

Email Limitations of Hover Buttons

While hover buttons are fully supported in landing pages, there are email client limitations for hover buttons.

Below is a list of email clients and how they support hover styles:

  • Apple Mail: Supports all three attributes (background-color, text-color, transition).

  • Yahoo Webmail: Supports all three attributes.

  • Gmail Webmail: Supports background-color and text-color. Transition is unsupported.

  • Outlook.com: Supports background color and text color. Transition is unsupported.

  • Outlook for Mac: Supports background color and text color. Transition is unsupported.

  • Everywhere else is unsupported.


โ€‹

Need more help? Contact support via live chat within Knak using the chat bubble in the bottom right corner or email support@knak.com

Did this answer your question?