Day Styles: Highlight and Color Calendar Days

Use day_styles rules to apply custom background colors, borders, and opacity to calendar days based on conditions like today, weekend, or has_event.

The day_styles configuration lets you define a list of rules that change how individual calendar day cells look. Each rule pairs a condition with a style object, and an optional priority integer decides which rule wins when multiple conditions match the same day. Use this feature to visually distinguish weekends from weekdays, draw attention to today’s cell, dim days in the past, or automatically tint days that have events scheduled.

Rule Structure

Each entry in day_styles has three top-level keys:

• condition — a string describing which days the rule applies to
• style — the visual properties to apply to matching days
• priority — optional integer (default 0) that resolves conflicts when multiple rules match the same day

Condition Values

condition · string

One of the following named conditions. A day matches when it satisfies the specified condition.

Value	Matches
today	The current calendar day
past	Any day before today
future	Any day after today
weekend	Saturday or Sunday
weekday	Monday through Friday
has_event	Any day that has at least one visible event from a specific calendar (requires the calendar sibling key)
day_of_week	A specific weekday (requires the day_of_week sibling key — see below)

Using day_of_week

When condition is day_of_week, add a sibling day_of_week key with the target day number (0 = Sunday, 6 = Saturday). You can also provide a list of numbers to match multiple days with one rule.

day_styles:
  - condition: day_of_week
    day_of_week: 1        # Monday
    style:
      background_color: '#E3F2FD'

Using has_event

When condition is has_event, you must also provide a calendar sibling key containing the entity ID (or virtual calendar ID) to watch. The rule only applies to days where that specific calendar has at least one event.

You can optionally narrow the rule further by adding a title_match sibling key. When set, the rule only matches days where the named calendar has at least one event whose title contains the given string. title_match uses the same matching syntax as event_styles and day_badges — prefix the value with exact: for an exact match or regex: for a regular expression.

# Any event on calendar.work makes the day match
day_styles:
  - condition: has_event
    calendar: calendar.work
    style:
      background_color: '#FFF9C4'

# Only days where calendar.work has a "standup" event match
day_styles:
  - condition: has_event
    calendar: calendar.work
    title_match: standup
    style:
      background_color: '#E3F2FD'
      border_color: '#1565C0'
      border_width: 2

Style Fields

style.background_color · string

A hex color string applied to the day cell’s background. You can also pass 'auto' to let the card automatically compute a soft tint derived from the event colors present on that day.

style.opacity · number

A number between 0 and 1 that controls the day cell’s overall transparency.

style.border_color · string

A hex color string for the day cell’s border.

style.border_width · number

The border width in pixels.

Priority

priority · integer · default: "0"

When two or more rules match the same day, the one with the highest priority is applied. If priorities are equal, the first matching rule in the list wins.

Convenience Shorthands

In addition to the full day_styles list, the card also accepts a pair of shorthand options for styling today’s cell. These are processed as day_styles rules internally and are a quick alternative to writing a full condition block.

today_background_color · string

A hex color shorthand for setting today’s background. Equivalent to a day_styles rule with condition: today and style.background_color set to the same value.

today_style · object

An object with any combination of background_color, opacity, border_color, and border_width applied to today’s cell.

today_style:
  background_color: '#E3F2FD'
  border_color: '#1565C0'
  border_width: 2

Examples

Highlight weekends with a light gray background

This rule gives Saturday and Sunday cells a subtle gray tint to help them stand out from the work week.

day_styles:
  - condition: weekend
    style:
      background_color: '#F5F5F5'

Show today with a bold blue background

A high priority of 10 ensures this rule overrides any other day style that might also match today, such as weekend.

day_styles:
  - condition: today
    style:
      background_color: '#1565C0'
    priority: 10

Dim past days

This rule reduces the opacity of every day in the past, creating a visual separation between what has happened and what is coming up.

day_styles:
  - condition: past
    style:
      opacity: 0.4

Auto-tint days that have events

Instead of choosing a fixed background color, pass 'auto' and let the card compute a soft tint derived from the event colors on each matching day.

day_styles:
  - condition: has_event
    calendar: calendar.personal
    style:
      background_color: 'auto'

Combine multiple rules

Rules are independent and additive. Here, past days are dimmed, weekends get a warm tint, and today is boldly highlighted above both.

day_styles:
  - condition: past
    style:
      opacity: 0.4
    priority: 1
  - condition: weekend
    style:
      background_color: '#FFF8E1'
    priority: 2
  - condition: today
    style:
      background_color: '#1565C0'
    priority: 10

Use background_color: 'auto' on days with events alongside a fixed background color for today. Set a higher priority on the today rule so it always wins, even if today has events.