Content Controls


Modify the essential details of your button, including the display text and any links associated with it.

  • Text – Set the button’s display text.
  • Link – Define the URL the button directs to when clicked.

Design Controls


Customize the appearance and design of your button, including its style, text attributes, and unique visual elements.

  • Style – Choose the overall design style for the button.
  • Text – Adjust text-related properties. (Note: This control is available only when the style is set to “text”)
    • Typography – Fine-tune the font style, size, and more.
    • Padding – Adjust the space around the button text.
      • Padding – Define specific padding values.
    • Fancy Underline – Add an eye-catching underline beneath the text.
    • Underline Color – Set the color for the underline.
    • Arrow – Incorporate an arrow design alongside the text.
      • Arrow – Choose an arrow style.
      • Custom Arrow – Use a unique arrow icon. (Note: Available only when arrow style is set to “custom”)
      • Space Before – Add spacing before the arrow.
      • Hover Transform – Alter the arrow’s appearance on mouse hover. (Note: Not available when arrow style is “arrow-3”)
      • Arrow Size – Define the size of the arrow.
  • Custom – Design a completely bespoke button. (Note: This control is available only when the style is set to “custom”)
    • Size – Adjust the button’s overall size.
      • Size – Choose from predefined size options.
      • Padding – Fine-tune the button’s padding. (Note: Available only when size is set to “custom”)
      • Override Width – Manually set the button’s width.
      • Full Width At – Determine the screen size where the button spans the full width.
    • Background – Choose the button’s background color.
    • Outline – Toggle the button’s outline.
      • Color – Set the outline’s color. (Note: Available only when outline is active)
      • Width – Define the thickness of the outline. (Note: Available only when outline is active)
      • No Fill On Hover – Have the button appear transparent when hovered over. (Note: Available only when outline is active)
    • Typography – Adjust the font style and related properties.
    • Corners – Select the button’s corner style.
      • Corner Radius – Customize the curvature of the corners. (Note: Available only when corner style is set to “custom”)
    • Icon – Incorporate an icon into the button’s design.
      • Icon – Choose an icon.
      • Position – Determine the icon’s placement relative to the text.
      • Size – Adjust the icon’s dimensions.
      • Color – Define the icon’s color.
      • Space Before – Add space before the icon.
      • Space After – Add space after the icon.
      • Hover Transform – Change the icon’s look when hovered over.
    • Effects – Apply special visual effects to the button.
      • Transition Duration – Set the time it takes for hover effects to appear or disappear.
      • Scale On Hover – Define how much the button enlarges when hovered over.
      • Shadow – Add a shadow effect to give the button depth.


Style the background and control elements when the button triggers a lightbox display.

  • Background – Define the lightbox’s background color.
  • Controls – Set the color for the lightbox’s control elements.


Adjust the space above and below your button, ensuring it fits perfectly within your layout.

  • Margin Top – Add or reduce space above the button.
  • Margin Bottom – Add or reduce space below the button.