Your events are displayed in two ways: on the main calendar view and in the detailed view (pop up or accordion). We use color in different ways to make your displayed events more attractive. What you see will depend on the calendar view AND your choices.
Where to find these design elements (everyone)
BREEZE
Full calendar
| Design item Use calendar color as accent color is toggled on.
 Result: Colors come from the Breeze ChMS. | Design item Use calendar color as accent color is toggled off.
 Result: Colors come from design item Event name background. |
Weekly view: Events list
| Design item Use calendar color as accent color is toggled on.
 Result: Color in calendar view comes from design item Events-Indication. Color in events list comes from the Breeze ChMS. | Design item Use calendar color as accent color is toggled off.
Result: Color in calendar view comes from design item Events-Indication. Color in events list come from design item Left border. |
Weekly view: Pills
| Design item Use calendar color as accent color is toggled on.
 Result: Colors in calendar view come from the Breeze ChMS. | Design item Use calendar color as accent color is toggled off.
Result: Color in calendar view comes from design item Pills-Background. |
Weekly view: Stacks
| Design item Use calendar color as accent color is toggled on.
Result: Colors in calendar view come from the Breeze ChMS. | Design item Use calendar color as accent color is toggled off.
 Result: Color in calendar view comes from design item Stack-Accent color. |
Cards (List) | Does not affect calendar view | Does not affect calendar view |
Cards (Grid) | Design item Use calendar color as accent color is toggled on.
 Result: Color in calendar view comes from the Breeze ChMS. | Design item Use calendar color as accent color is toggled off.
 Result: Color in calendar view comes from design item Left border. |
Slider | Does not affect calendar view | Does not affect calendar view |
GCAL
Full calendar
| Design item Use calendar color as accent color is toggled on.
 Result: Color comes from Google Calendar. | Design item Use calendar color as accent color is toggled off.
 Result: Color comes from design item Event name background. |
Weekly view: Events list
| Design item Use calendar color as accent color is toggled on.
 Result: Color in calendar view comes from design item Events-Indication. Color in events list comes from Google Calendar. | Design item Use calendar color as accent color is toggled off.
 Result: Color in calendar view comes from design item Events-Indication. Color in events list come from design item Left border. |
Weekly view: Pills
| Design item Use calendar color as accent color is toggled on.
 Result: Color in calendar view comes from Google Calendar. | Design item Use calendar color as accent color is toggled off.
 Result: Color in calendar view comes from design item Pills-Background. |
Weekly view: Stacks
| Design item Use calendar color as accent color is toggled on.
 Result: Color in calendar view comes from Google Calendar. | Design item Use calendar color as accent color is toggled off.
 Result: Color in calendar view comes from design item Stack-Accent color. |
Cards (List) | Does not affect calendar view | Does not affect calendar view |
Cards (Grid) | Design item Use calendar color as accent color is toggled on.
 Result: Color in calendar view comes from Google Calendar. | Design item Use calendar color as accent color is toggled off.
 Result: Color in calendar view comes from design item Left border. |
Slider | Does not affect calendar view | Does not affect calendar view |
2024.04.08 Update for GCal
In Google Calendar, you can choose your calendar color. Did you know that you can also choose different colors for events within a calendar?
In the example below, the calendar color is yellow. However, for one event, I chose a lilac (light purple) color.
When 'Use calendar color as accent color' is toggled on, Display.Church will reproduce the colors as you have chosen them.
THE ACCENT COLOR ON THE LEFT BORDER OF YOUR EVENTS DETAILS
[list, accordion, pop up]
Here are some examples of what we are speaking about using a green color (not the default).
|  |
|
|
IN GENERAL the accent color on the left border of your events details works in this way:
Use calendar color as accent color is toggled on --- the color comes from Breeze or GCal (depending on your integration.
Use calendar color as accent color is toggled off --- the color comes from the design item Left border.
Where to find these design elements
Use calendar color as accent color
 | Step 1: Click on the Design tab.
Step 2: Scroll down to the Events section.
Step 3: Click on Events to expand the section.
|
 | Step 4: Scroll down to the Event details subsection.
Step 5: Toggle on or off Use calendar color as accent color. It will turn blue when toggled on. |
Event name background
| Step 1: Click on the Design tab.
Step 2: Scroll down to the Full Calendar section.
Step 3: Click on Full Calendar to expand the section.
|
| Step 4: Scroll down to the Events subsection.
Step 5: Locate Event name background.
Step 6: Use the default or choose a custom color value. If you are not yet familiar with using our custom color picker, this is the article for you. |
Events-Indication
| Step 1: Click on the Design tab.
Step 2: Scroll down to the Weekly View section.
Step 3: Click on Weekly View to expand the section.
|
| Step 4: Scroll down to the Events subsection.
Step 5: Locate Indication.
Step 6: Use the default or choose a custom color value. If you are not yet familiar with using our custom color picker, this is the article for you. |
Pills-Background
| Step 1: Click on the Design tab.
Step 2: Scroll down to the Weekly View section.
Step 3: Click on Weekly View to expand the section.
|
| Step 4: Scroll down to the Pills subsection.
Step 5: Locate Background.
Step 6: Use the default or choose a custom color value. If you are not yet familiar with using our custom color picker, this is the article for you. |
Stack-Accent color
| Step 1: Click on the Design tab.
Step 2: Scroll down to the Weekly View section.
Step 3: Click on Weekly View to expand the section.
|
| Step 4: Scroll down to the Stack subsection.
Step 5: Locate Accent color.
Step 6: Use the default or choose a custom color value. If you are not yet familiar with using our custom color picker, this is the article for you. |
Left border
| Step 1: Click on the Design tab.
Step 2: Scroll down to the Event Listing/Details Colors section.
Step 3: Click on Event Listing/Details Colors to expand the section.
|
| Step 4: Scroll down to the Listing subsection.
Step 5: Locate Left border.
Step 6: Use the default or choose a custom color value. If you are not yet familiar with using our custom color picker, this is the article for you. |