Webサイト上でカレンダーを表示したい機会は意外と多いです。そんな時には機能面だったり、デザイン面で選択が決まるでしょう。複雑なHTMLを記述するようなものは避けたいはずです。 今回紹介するColor Calendarはシンプルなカレンダーライブラリです。日付と、日付に基づいたイベントを一覧表示します。

Color Calendarの使い方

表示例です。日ごとにイベントの有無が表示されます。

別な例。色の変更も簡単です。

二つのカレンダーを表示することもできます。

Color Calendarは依存ライブラリはなく、VueやReactの中で使うことができます。日付に対するイベントの追加、日付を移動した際などのイベント実行、テーマなどが用意されています。シンプルな分、使い勝手が良さそうです。

Color CalendarはTypeScript製のオープンソース・ソフトウェア(MIT License)です。

PawanKolhe/color-calendar: ? A customizable calendar JavaScript UI widget/component library with the ability to show events.