Skip to content

DatePicker CSS variables

Summary


CSS Variables table


Css variable
Fallback
Default
/
/
/
/
/
/
/
/
blue
orange
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/
/

CSS Variables list



--mbx-datepicker-background

Fallback
Default
/
/


Fallback value for --mbx-datepicker-background-light and --mbx-datepicker-background-dark



--mbx-datepicker-background-light

Fallback
Default


DatePicker background when dark mode is `off'



--mbx-datepicker-background-dark

Fallback
Default


DatePicker background when dark mode is `on'



--mbx-datepicker-text-color

Fallback
Default
/
/


Fallback value for --mbx-datepicker-text-color-light and --mbx-datepicker-text-color-dark



--mbx-datepicker-text-color-light

Fallback
Default


DatePicker text color when dark mode is `off'



--mbx-datepicker-text-color-dark

Fallback
Default


DatePicker text color when dark mode is `on'



--mbx-datepicker-icon

Fallback
Default
/
/


Fallback value for --mbx-datepicker-icon-light and --mbx-datepicker-icon-dark



--mbx-datepicker-icon-light

Fallback
Default


DatePicker calendar icon color when dark mode is `off'



--mbx-datepicker-icon-dark

Fallback
Default


DatePicker calendar icon color when dark mode is `on'



--mbx-datepicker-icon-hover

Fallback
Default
/
/


Fallback value for --mbx-datepicker-icon-hover-light and --mbx-datepicker-icon-hover-dark



--mbx-datepicker-icon-hover-light

Fallback
Default
blue


DatePicker calendar icon color when dark mode is `off', on hover



--mbx-datepicker-icon-hover-dark

Fallback
Default
orange


DatePicker calendar icon color when dark mode is `on', on hover



--mbx-datepicker-calendar-background

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-background-light and --mbx-datepicker-calendar-background-dark



--mbx-datepicker-calendar-background-light

Fallback
Default


Extended from Calendar - Calendar background when dark mode is `off'



--mbx-datepicker-calendar-background-dark

Fallback
Default


Extended from Calendar - Calendar background when dark mode is `on'



--mbx-datepicker-calendar-text-color

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-text-color-light and --mbx-datepicker-calendar-text-color-dark



--mbx-datepicker-calendar-text-color-light

Fallback
Default


Extended from Calendar - Calendar text color when dark mode is `off'



--mbx-datepicker-calendar-text-color-dark

Fallback
Default


Extended from Calendar - Calendar text color when dark mode is `on'



--mbx-datepicker-calendar-background-hover

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-background-hover-light and --mbx-datepicker-calendar-background-hover-dark



--mbx-datepicker-calendar-background-hover-light

Fallback
Default


Extended from Calendar - Calendar background when dark mode is `off', on hover



--mbx-datepicker-calendar-background-hover-dark

Fallback
Default


Extended from Calendar - Calendar background when dark mode is `on', on hover



--mbx-datepicker-calendar-text-color-hover

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-text-color-hover-light and --mbx-datepicker-calendar-text-color-hover-dark



--mbx-datepicker-calendar-text-color-hover-light

Fallback
Default


Extended from Calendar - Calendar text color when dark mode is `off', on hover



--mbx-datepicker-calendar-text-color-hover-dark

Fallback
Default


Extended from Calendar - Calendar text color when dark mode is `on', on hover



--mbx-datepicker-calendar-arrow

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-arrow-light and --mbx-datepicker-calendar-arrow-dark



--mbx-datepicker-calendar-arrow-light

Fallback
Default


Extended from Calendar - Calendar arrow color when dark mode is `off'



--mbx-datepicker-calendar-arrow-dark

Fallback
Default


Extended from Calendar - Calendar arrow color when dark mode is `on'



--mbx-datepicker-calendar-arrow-hover

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-arrow-hover-light and --mbx-datepicker-calendar-arrow-hover-dark



--mbx-datepicker-calendar-arrow-hover-light

Fallback
Default


Extended from Calendar - Calendar arrow color when dark mode is `off', on hover



--mbx-datepicker-calendar-arrow-hover-dark

Fallback
Default


Extended from Calendar - Calendar arrow color when dark mode is `on', on hover



--mbx-datepicker-calendar-selected-background

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-selected-background-light and --mbx-datepicker-calendar-selected-background-dark



--mbx-datepicker-calendar-selected-background-light

Fallback
Default


Extended from Calendar - Calendar selected cell background when dark mode is `off'



--mbx-datepicker-calendar-selected-background-dark

Fallback
Default


Extended from Calendar - Calendar selected cell background when dark mode is `on'



--mbx-datepicker-calendar-selected-text-color

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-selected-text-color-light and --mbx-datepicker-calendar-selected-text-color-dark



--mbx-datepicker-calendar-selected-text-color-light

Fallback
Default


Extended from Calendar - Calendar selected cell text color when dark mode is `off'



--mbx-datepicker-calendar-selected-text-color-dark

Fallback
Default


Extended from Calendar - Calendar selected cell text color when dark mode is `on'



--mbx-datepicker-calendar-today-color

Fallback
Default
/
/


Extended from Calendar - Fallback value for --mbx-datepicker-calendar-today-color-light and --mbx-datepicker-calendar-today-color-dark



--mbx-datepicker-calendar-today-color-light

Fallback
Default


Extended from Calendar - Calendar today color when dark mode is `off'



--mbx-datepicker-calendar-today-color-dark

Fallback
Default


Extended from Calendar - Calendar today color when dark mode is `on'



--mbx-datepicker-modal-background

Fallback
Default
/
/


Extended from Modal - Fallback value for --mbx-datepicker-modal-background-light and --mbx-datepicker-modal-background-dark



--mbx-datepicker-modal-background-light

Fallback
Default


Extended from Modal - Modal background when dark mode is off



--mbx-datepicker-modal-background-dark

Fallback
Default


Extended from Modal - Modal background when dark mode is on



--mbx-datepicker-modal-x-color

Fallback
Default
/
/


Extended from Modal - Fallback value for --mbx-datepicker-modal-x-color-light and --mbx-datepicker-modal-x-color-dark



--mbx-datepicker-modal-x-color-light

Fallback
Default


Extended from Modal - Modal x icon color when dark mode is off



--mbx-datepicker-modal-x-color-dark

Fallback
Default


Extended from Modal - Modal x icon color when dark mode is on



--mbx-datepicker-modal-x-color-hover

Fallback
Default
/
/


Extended from Modal - Fallback value for --mbx-datepicker-modal-x-color-hover-light and --mbx-datepicker-modal-x-color-hover-dark



--mbx-datepicker-modal-x-color-hover-light

Fallback
Default


Extended from Modal - Modal x icon color when dark mode is off, on hover



--mbx-datepicker-modal-x-color-hover-dark

Fallback
Default


Extended from Modal - Modal x icon color when dark mode is on, on hover