The design of Amelia front-end forms and inputs relies on a few basic colors and styles. It makes customizing the design incredibly smooth and straightforward, so you can adjust Amelia to match any corporate branding and Ideakit theme.

Please note: Once you choose the colors and font that you prefer and Save the changes it is necessary to delete cache on your page where booking form is so the changes can be shown.

Video Version

To customize the design, go to your Ideakit Admin panel with an admin account, and  go to Amelia » Customize. There you will see the WYSIWYG style customizer. All changes are visible in real time in the righthand preview box, and after you click “Save”, the configured style will apply for all front-end forms.

Primary Color

This setting defines the primary color used for the commonly highlighted controls and parts of the user interface – buttons, switches, etc. It’s best to match this color with your primary brand color, such as your main logo color.

Primary Gradient

The two colors in this setting define the gradients on elements such as Calendar, or default cover for a Service Catalog. Play around with the setting to see what matches your website design best.

Text color

This is the main text color used in labels, dropdowns, etc. It’s best to match the color to your theme’s palette, as some of the plugin’s elements do not have a background and will inherit it from the theme

Text color on Background

Text color that will be used in elements that do apply gradient or primary color background. Choose a color which contrasts enough with the colors you defined in settings above.

Font

This is the primary font that will be used in plugin’s front-end interface controls. Choose one that matches your theme best.