Fixed Calendar Colors

Any color that you see on your calendar can be changed. On the left-hand side of the embedding editor screen for your calendar, you will see a box divided into four tabs labeled "Display", "Custom Colors", "More Colors", and "Embedding." The "Custom Colors" and "More Colors" tabs control the colors for your calendar.

If you change any of your colors, you can preview the final result on the right-hand side of the embedding screen. Once you have changed your colors, you can see the color changes from the defaults in your final embedding code. You can see both the hexadecimal color code (ex. "FFFFFF") and the three letter code (ex. "htc") for the calendar feature whose color was changed.

In the "Custom Colors" and "More Colors" tabs you'll see the name of the item you're changing the color code for, a text field where you can type in the hexidecimal code for the color you want, or you can click on the pencil icon to choose a color from a palette.

fixed calendar colors

Here is the code for a fixed calendar whose colors have been changed:

HTML Example:

<iframe src="" style="width:700px;height:600px;overflow-y:hidden;border:1px solid silver" scrolling="no"></iframe>

The highlighted parts of the code are where colors have been added and changed from the default calendar color settings. The live version of this calendar looks like this:


If you want to change the colors of a custom theme that we provide, you can first click on the "Display" tab, select a color theme from the "Standard Themes" drop-down menu. Then you can go back to the "Custom Colors" tab to change the colors of the theme.