Skip to main content

Global form styles

Hey everyone, I’m new to FluentForms and was wondering if there’s a way to define custom global styles for all my forms. The Custom CSS/JS option in the form settings is helpful, but I’d prefer not to add the same CSS to each form over and over again.

Thank you! 😊

Nick Porter

I had the same problem try this.

Just add this to you Global CSS and change to suit.

.ff_form_modal .ff_modal_btn {
background-color: #E0F2F1 !important; / base colour /
color: #1A1A1A !important; / text colour /
border-radius: 30px !important; / fully rounded /
padding: 5px 5px !important; / medium feel /
font-size: 16px;
font-weight: 600;
border: none;
box-shadow: none;
transition: background-color 0.3s ease; / smooth fade on hover /
}

.ff_form_modal .ff_modal_btn:hover {
background-color: #61CE70 !important; / hover colour /
cursor: pointer;
}

Hey Marc Deckert Marc.
Check out my Fluent Forms tutorials here: https://easywebdesigntutorials.com/tutorial_tags/fluent-forms/