Adding custom CSS to MemberSpace

MemberSpace has a robust editor in our Customize > Look & Feel section. It allows you to adjust fonts, colors, and borders for almost any element your members will see.

However, sometimes you want to add changes that the editor doesn't currently allow. To do that you'll need to add custom CSS code in the bottom left side of the editor:

We recommend not adding any custom CSS unless you are familiar with it - our support team won't be able to help you troubleshoot 😢.

Custom CSS options customers sometimes add

Any code you add below that says "ADD COLOR OR HEX CODE HERE" needs to be replaced with either a hex code (e.g. #FF0000) or a color name (e.g. red).

After you add any custom CSS make sure you click 'Save Changes' at the top:


Remove the "Have a coupon?" link from your payment form:

.modal-wrapper .coupon-code {display: none;}


Change your Create Account button hover background:

.signup-login-form .signup-login-buttons .sign-up:hover {background: ADD COLOR OR HEX CODE HERE;}


Change your Create Account button hover text color:

.signup-login-form .signup-login-buttons .sign-up:hover {color: ADD COLOR OR HEX CODE HERE;}


Change your Log In button hover background:

.signup-login-form .signup-login-buttons input[type="submit"]:hover {background: ADD COLOR OR HEX CODE HERE;}


Change your Log In button hover text color:

.signup-login-form .signup-login-buttons input[type="submit"]:hover {color: ADD COLOR OR HEX CODE HERE;}


Add a border to your entire form:

.modal-wrapper {border: 1px solid ADD COLOR OR HEX CODE HERE;}


Change the banner alert background color (
see example):

.alert-success, .alert-notice, .alert-warning, .alert-error {animation: none; background: ADD COLOR OR HEX CODE HERE; }


Change the banner alert text color (see example):

.alert-success, .alert-notice, .alert-warning, .alert-error {color: ADD COLOR OR HEX CODE HERE;}


Change the banner alert link text color (
see example):

.alert-success a, .alert-notice a, .alert-warning a, .alert-error a {color: ADD COLOR OR HEX CODE HERE;}


Change the color for the "X" to close a pop up form:

.modal-wrapper .modal-close-button {color: ADD COLOR OR HEX CODE HERE;}
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.