Skip to content

Calendar

UX/UI Guidelines

Check the design documentation of the component in ZeroHeight.

From Figma to code

...

Customization

INFO

Check everything about the customization mechanics in the "How it works" documentation.

CSS VariableTypeDescription
--z-calendar--header-bgcolor
--z-calendar--header-colorcolor
--z-calendar--bgcolor
--z-calendar--colorcolor
--z-calendar--radiusdistance
--z-calendar--shadowshadow

The calendar component it's highly customizable. You can use the --z-calendar--header--bg, --z-calendar--header--color, --z-calendar--bg, --z-calendar--color and --z-calendar--radius to customize the background and color of the header, the background and color of the calendar, and the radius of the calendar.

Or more complex assignations:

Accessibility

...