Login Button

Estimated reading: 3 minutes 152 views

Users can customize the login button.

  • Hover over the login button in the form, user will see the edit button.
  • Click on the edit button, login button window will appear in the style panel.

Background: –

  • Users can change the background color of the checkbox, click on the background color.
  • Select your desired color from the palette, click on the publish button to save the changes.

Border: –

  • To change the border width of the checkbox, hover over the borderin the styles window and a slider will appear in front of you.
  • Adjust the slider to change the width of the border, click on the publish button to save the changes.
  • Click on to reset the border width of your checkbox.

Border Color: –

  • To change the color, click on the border color.
  • A color palette will appear in front of you, select your desired color.
  • Click on the publish button to save the changes. 

Padding

  • To change the horizontal padding of the button, hover over the paddingin the styles window and you will see the slider in front of you.
  • You can increase or decrease the horizontal padding by adjusting the slider, click on the publish button to save the changes.

Padding Top: –

  • To change the top padding of the button, hover over the padding top in the styles window you will see the slider in front of you.
  • You can increase or decrease the top padding by adjusting the slider, click on the publish button to save the changes.

Padding Bottom: –

  • To change the bottom padding of the button, hover over the padding bottomin the styles window slider will appear in front of you.
  • You can increase or decrease the bottom padding by adjusting the slider, click on the publish button to save the changes.

Radius: –

  • To change the corner radius of the button, hover over the radiusin the styles window slider will appear in front of you.
  • You can increase or decrease the corner radius of the button by adjusting the slider, click on the publish button to save the changes.
  • Click on button to reset the radius.

Shadow: –

  • To change the shadow width of the button, hover over the shadowin the styles window and you will see the slider in front of you.
  • You can increase or decrease the shadow width of the button by adjusting the slider, click on the publish button to save the changes.
  • Click on button to reset the shadow.

Shadow Opacity: –

  • To change the opacity of the shadow of the button, hover over the shadowopacityin the styles window and you will see the slider in front of you.
  • Adjust the slider to increase/decrease the shadow opacity of the button.
  • Click on button to reset the shadow opacity.

Font: –

  • To change the font style of the button, click on the font & select your desired font style from the menu.
  • Click on the publishbutton to save the changes.

Size: –

  • To change the size of the button, hover over the sizein the styles window and you will see the slider in front of you.
  • Adjust the slider to change the size of the button.
  • Click on the publishbutton to save the changes.
  • Click on to reset the size of remember me text.

Color: –

  • To change the font color of the button, click on the color.
  • The color palette will open, select your desired color.
  • Click on the publish button to save the changes.
Share this Doc

Login Button

Or copy link

CONTENTS