How do I change the calendar background color?

One way to change the calendar background color is to choose a different form theme, at Edit Form → Settings → Style → Global.

If you want to keep the current form theme you can change the color of just the calendar background by going to Forms → Settings → Custom CSS & JS → Custom CSS and adding this CSS:

1
2
3
4
5
.quform-datepicker .k-calendar .k-header,
.quform-datepicker .k-calendar .k-footer,
.quform-datepicker .k-calendar .k-header .k-state-hover {
    background-color: #123456 !important;
}
.quform-datepicker .k-calendar .k-header,
.quform-datepicker .k-calendar .k-footer,
.quform-datepicker .k-calendar .k-header .k-state-hover {
	background-color: #123456 !important;
}

Replace #123456 with the desired hex color.

Be inspired. © 2024 ThemeCatcher Ltd. 20-22 Wenlock Road, London, England, N1 7GU | Company No. 08120384 | Built with React | Privacy Policy