Open Web Calendar

The Open Web Calendar uses ICS/ICal calendars online and displays them in one calendar. You can use it with Nextcloud, Outlook, Google Calendar, Meetup and other calendar systems using the ICS standard.

To merge several calendars, please input the URLs of the ICS calendars here:

To embed the calendar, use this code on your website:

You can view the resulting calendar below.

You can make additional customizations of the calendar.

Otsikko

Muuttaaksesi otsikkoa, syötä kalenterin nimi tähän:

Alkamispäivä

Muuta kalenterin alkamispäivää:

Ensimmäinen tunti

Muuta kalenterinäkymän ensimmäistä tuntia:

Viimeinen tunti

Muuta kalenterinäkymän viimeistä tuntia:

Ajan lisäys

Muuta ajan lisäystä päivä- ja viikkonäkymässä:

10 minuuttia 15 minuuttia 30 minuuttia 1 tunti

Ajannäyttö

Voit valita 24 tunnin tai 12 tunnin kellon välillä. Muitakin vaihtoehtoja on. Katso määrittely.
24:00 - 1:15, 13:45 24:00 - 01:15, 13:45 am/pm - 1:15 am, 1:45 pm am/pm - 01:15 am, 1:45 pm AM/PM - 1:15 AM, 1:45 PM AM/PM - 01:15 AM, 01:45 PM

Kieli

Voit valita kalenterin kielen.

The calendar is always in this language:

The calendar is in the language of the viewer. If the language is not translated, it shows up in:

Translate

Teemat

Voit valita kalenterin teeman.
Terrace Dark Material Flat Contrast Black Contrast White

Links

Events may have locations and URLs. If you embed the calendar into a website, you can choose where the clicked link opens the page.
Open the linked document in the same frame as it was clicked. Open the linked document in the parent frame. Open the linked document in a new window or tab. Open the linked document in the full body of the window.

Days of the Week

Maanantai - Sunnuntai The week may start on Monday or Sunday.
Sunnuntai - Lauantai Maanantai - Perjantai

Custom Style with CSS

You can change the color of your calendar and many more properties using CSS. Your customization has priority over the Skin you choose. Below, you can choose from a few customizations we prepared for you.

• You can change the background color of the calendar.
• You can change the color of the elements which can be clicked.
• You can change the background color of the current date.
• If you like to have a different color for the days, you can specify this, too.
• Some days of the calendar have a different color if they are not within the month.

You can specify your own CSS properties if you like. These are examples of CSS classes to style events: .event {} .UID-... {} .CATEGORY-... {} .CALENDAR-INDEX-0 {} .CALENDAR-INDEX-... {} .TRANSP-OPAQUE {} .TRANSP-TRANSPARENT {} .CLASS-PRIVATE {} .CLASS-CONFIDENTIAL {} .CLASS-PUBLIC {} .STATUS-TENTATIVE {} .STATUS-CONFIRMED {} .STATUS-CANCELLED {} .PRIORITY-1 {} .PRIORITY-... {} .error {}

Event Status

Change the look of the event description depending on the status:

tentative confirmed cancelled

Loading Animation

In some cases, the server takes quite a time to load the calendar. In case the server uses a free plan on Heroku, the server needs to start first.
circular loader no loader

Calendar Tabs

The Month view is the default. However, you can choose to show a different view in the beginning. Choose one:
Kuukausi Viikko Päivä Esityslista

It might be that you do not want to show all controls for the users to see. Choose here which controls you would like to display:

Kuukausi Viikko Päivä Esityslista Seuraava Edellinen Tänään Päivämäärä

Time Zone

The timezone is taken from the browser of the user. If you want your calendar to be fixed in one timezone, you have the option below. Your browser uses this time zone: loading…
use the timezone of the browser

Hosting the Specification

The calendar can be generated not only using the URL, but also through a JSON or YAML specification from a file. The customization above generates this specification:

You can download this specification and place it somewhere on the web. This way you are still in control over the customization of the calendar after you shared the link, e.g. on GitHub in a Gist. Once you have placed the specification somewhere online, you can create a link like this one: