Color Theme
Nucleus provides seven distinct theme options:
1. Classic Dark
2. Classic Light
3. Vibrant Dark
4. Vibrant Light
5. Monochrome Dark
6. Monochrome Light
7. Custom
The first 6 Color Themes give you a place to start when building out your color scheme for your Nucleus. The 7th allows you to fully customize your colors within your Nucleus however you like. To navigate and select one of these options, click settings and then Color Theme on the left hand side.
The drop down menu will allow you to select which theme you would like to go with. Once you have chosen a theme click save changes to apply the theme to your Nucleus. When you select one of these themes, you can also customize the color palette, that way you aren’t stuck with what you've got.
If you are customizing your Nucleus from scratch, here are some best practices to keep your Nucleus looking professional, inviting, and making a good first impression:
- Use the brand colors found in your church's brand/style guide. If you don't have a guide, use the primary and secondary colors of your church's logo.
- Select one color to use for your navigation and only use shades of that color for each background option. For instance, you could select a dark color for Navigation Background 1, and then choose lighter and lighter shades as you customize Backgrounds 2-4. Or you could select a light color for Navigation 1, and then choose darker and darker shades instead.
- For the Card Body Backgrounds (there are only two), use shades of the same color.
- Ensure there is a large contrast between the text color and the background color upon which the text lives. (i.e. If the background is light, make sure the text is dark. If the background is dark, make sure the text is light.)
There are four areas of your Nucleus you can customize. To change a color, you can simply type in a new color hex code, or click on the circle beside the hex code and select a color using the palette panel that appears.
1. Homepage
Header Background: Background/overlay color of the homepage header.
Header Text: Color of the homepage title text, search and menu icons.
Body Background: Background color of the homepage body (behind the cards).2. Footer
Footer Background: Background color of the site footer.
Footer Text: Color of the site footer text
3. Page & Sermon
Header Background: Color of card header background/overlay, section headings, buttons and links. You can override this color individually in each card's settings.
Header Text: Color of card title text, search, and menu icons.
Body Background 1: Background color of card body (behind the main content).
Body Background 2: Background color of form inputs and content of linked/embedded cards.
Body Text: Color of all card paragraphs, labels, and other content.
Body Headings: Applies to all page body headings. You can override this color in individual page settings.
Body Actions: Applies to page buttons, links, and selected inputs, and sermon progress bars.
4. Card Colors
Body Background: Color of the background of your cards.
Body Text: Color of text on your cards.
5. Navigation
Navigation Background: Background color of the navigation bar and search/mobile menu overlays.
Navigation Background 2: Background color of navigation dropdown panels.
Navigation Background 3: Background color top level active/hovered menu items and navigation dropdown panels.
Navigation Background 4: Background color of active/hovered dropdown panel menu items.
Navigation Text: Color of menu items text.
Important Note: If you have the Sermon Engine enabled, the changes you make to your Custom Theme will also apply there.
Another Important Note: Don't forget to save!