Financial Calendar

The Financial Calendar is a widget that provides a calendar view of financial transactions for the past 12 months, enabling customers to easily track money in and out and better plan ahead. By highlighting daily spending trends and marking important transactions like upcoming bills and income, this feature helps users stay on top of their finances and gain a clearer understanding of their day-to-day spending.

This guide will walk you through how to use and navigate the Financial Calendar effectively.

How it works

Daily Spending

Days in the calendar are color-coded based on how the user's spending compares to their daily average over the previous three months.

Green: Low spend day (at least 10% less than the daily average)
Amber: Average spend day (within ±10% of the daily average)
Red: High spend day (at least 10% higher than the daily average)

Understanding Income, Bills and Subscriptions

Specific days are marked with indicators for income, bills and subscriptions, whether they have already occurred or are forecasted

Income: A green label indicating the day income is expected or has been received
Bills and Subscriptions: A dot below the date showing that a recurring bill or subscription payment has either been made or is due

Customization

The following customizations can be applied, by appending search parameters to the generated URL:

month
- An ISO 8601 date time string within the desired month determines which month is currently viewed
- To set the calendar to default to January 2025 we could set the month to 2025-01-01T00:00:00
- For example https://widgets.thisisbud.com/financial-calendar?token=an-example-token&month=2025-01-01T00:00:00

Accessibility

Users can move between months and days either via the cursor or using the keyboard. When focused on the calendar, days can also be navigated using the keyboard arrow keys ⬅️ ⬆️ ⬇️ ➡️. Clicking on specific dates reveals detailed transaction information.

Switching months: Use the left and right arrow buttons at the top of the calendar to navigate between months
Historical transactions: Click on a past date to see a list of transactions for that day
Forecasted transactions: Click on a future date to see forecasted transactions for that day