- Main
- Home
- Page layouts
- Pad layouts
- Content elements
- Form elements
- Form wizards
- Text editors
- Pickers
-
HTML components
- Modal windows
- Select menus
- Content tabs
- Content tabs (Pills)
- Accordion and navs
- HTML buttons
- Notifications (PNotify)
- Notifications (Noty & jGrowl)
- HTML tooltips
- Inline alerts
- Pagination conventions
- Labels & badges
- Loading & progress bars
- Image popups
- Media objects
- Dynamic table of contents
- NoUI sliders
- Ion range sliders
- Session timeout
- Idle timeout
- Dynamic tree views
- Context menu
- Floating action buttons
- Image cropper
- Block UI
- Drag and drop
- Charts and graphs
- Maps integration
- JQuery UI
- File uploaders
- Event calendars
- Tables
- Animations
- Icons
- Examples
- Content types
- User management
- SAS examples
- Menu Grouping Examples
- Menu ConventionsInfo
Previous Page / Control Center Title
FullCalendar allows you to change the color of all events on the calendar using the eventColor
option. Also you can change text, border and background colors for events in a specific Event Source with event source
options (backgroundColor, color, textColor and borderColor) and for individual events with color
option, which sets an event's background and border color. Example below demonstrates event colors based on a day of the week.
Events that appear as background highlights can be achieved by setting an Event Object's rendering
property to background
. Background events that are timed will only be rendered on the time slots in agenda view. Background events that are all-day will only be rendered in month view or the all-day slots of agenda view. Also the spans of time not occupied by an event can be colored by setting the rendering
property to inverse-background
.