You no longer need to manually update at least 7x5=35 date instances!

Update your calendar to the desired month, year, and selected date easily.

This is
you editing the calendar.
Clicks
60+
Typings
110+
Duration
1m 30s
Let me show you
my way.
Clicks
19
Typings
1
Duration
26s
Even easier from the second.
Features
Instantly update all dates

No need to manually update each date to match the calendar month and year anymore.

Just click Update calendar, and this will automatically fill in the numbers for you!

Automatically reflect each style
The plugin automatically applies styles like
Today
,
Selected Day
,
Prev/Next month
to each date, commonly seen in date pickers and calendars.
No more manually adjusting properties in the right sidebar!
Fully supports ISO Week

The ISO week system, which divides the year into 52 weeks, is also automatically adjusted to match each week.

Here's how to use it!
Step 1 — Designate date
MONTH
Calendar

Select the Calendar month and year you want to display on the calendar.

00
Designated today
Select the Calendar month and year you want to display on the calendar. Specify the date to be marked as
Today
.
By default, the actual current date is used.
Selected day
If you want to generate a calendar with a specific selected date, enable
Select specific day
and set the desired date.
By default, the actual current date is used.
Step 2 — Configure styles
Click the instance corresponding to each style (e.g., default day, today,selected day) and press the
Parse properties and values
to fetch its Properties and related values.

By default, all Properties and Values applied to the instance will be loaded. If you need to apply multiple conditional styles at once, you can modify the parsed text accordingly.

Step 3 — Export and import styles
Export style
After setting up the styles in Step 2, you can either export them as a
.txt
file or copy and paste them into your Figma file next to the calendar component. This way, you won't have to manually configure the styles each time.
The
Export as .txt
and
Copy to clipboard
are located at the bottom of the Style tab.
Import style
To reuse exported styles, click the
Import style
. If you select text in Figma, the plugin will import the selected text automatically.
Otherwise, you can choose a previously exported
.txt
file.
Step 4 — Update calendar
Click the calendar instance you want to update. Then, press the
Update calendar
.
Wait a moment, and the calendar will be generated exactly according tothe specified date!
Required conditions
1
Data instance

Each date element must be an same Instance where Properties can be configured.

1
2
3
4
5
6
7
Week row

Seven date instances belonging to the same week must be grouped into a single row.

MONTH
English calendar

All calendar text must be written in English. Arbitrary text values are not allowed.

Works, but limited in some cases
Five or fewer week block

If the master variant of the calendar does not include a sixth week row, displaying certain months may cause issues.

Overridden instance

If the master variant includes overridden instances, you must manually revert them to the default state.

(e.g., The text node in the "Today" instance was overridden to use "Black" weight.)

Missing fonts

If the fonts used in the calendar are not installed, they will be replaced with Figma's default font, Inter.

Component-specific option

Special style changes, like Disabled days or Selected day of week, are not supported.

Data input field

If the calendar includes input fields, the plugin will not populate the weekday or date values within them.

Independent value for overlapping styles

If multiple conditions are combined into a single Property value, simultaneous application is not possible.

Need more detailed settings?
First day of week
You can set whether the week starts on
Sunday
or
Monday
.
By default, it reflects the instance's original settings, but you can adjust it if needed.
Prioritize “Prex/Next month” style
If
Today
or
Selected day
 falls in the previous/next month, how it is displayed depends on each calendar system.
By default,
Today
and
Selected day
will be prioritized even if they are outside the current month, but if you want to hide them, simply turn on the
Prioritize Prev/Next
 toggle.
Tags
Figma plugin
Published on
April 28, 2025
Works