dyCalendarJS

This is an open source MIT Licensed project and you can use it in your websites for FREE!

Created by: Yusuf Shakeel

Get the project code from its GitHub Repository

Click here to watch the tutorial video.

Click here for the documentation.


Today calendar (default skin)

Month calendar (default skin)


Day calendar (default skin)

Today calendar (skin-blue)

Today calendar (skin-black shadow-default)


Month calendar (default current month) (skin-red)

Month calendar (21st October 1990) (skin-green shadow-default)


Month Calendar 1 target class = "dycalendar-month"

Month Calendar 2 target class = "dycalendar-month"


Month Calendar with prev-next-button id = "dycalendar-month-prev-next-button"

Month Calendar with prev-next-button class = "dycalendar-month-prev-next-button"

Month Calendar with prev-next-button class = "dycalendar-month-prev-next-button"


Month calendar (default current month) (round-edge)

Month calendar (default current month) (round-edge shadow-default)

Month calendar (default current month) (round-edge shadow-black)

Month calendar (default current month) (round-edge shadow-blue)

Month calendar (default current month) (round-edge shadow-green)

Month calendar (default current month) (round-edge shadow-purple)

Month calendar (default current month) (round-edge shadow-red)

Month calendar (default current month) (round-edge shadow-spacegray)


Month calendar (default current month) (round-edge default skin gradient)

Month calendar (default current month) (round-edge skin-black gradient)

Month calendar (default current month) (round-edge skin-blue gradient)

Month calendar (default current month) (round-edge skin-green gradient)

Month calendar (default current month) (round-edge skin-purple gradient)

Month calendar (default current month) (round-edge skin-red gradient)

Month calendar (default current month) (round-edge skin-spacegray gradient)