← All examples

Highlight gaps in the calendar

Marks empty slots in the Booksy Biz schedule with a yellow pattern so you instantly see gaps to upsell or take a walk-in.

Code to copy

[class*="calendar" i] [class*="slot" i]:not(:has([class*="event" i])):not(:has([class*="appointment" i])),
[class*="day-grid" i] [class*="empty" i] {
  background: repeating-linear-gradient(45deg, #fffde7, #fffde7 8px, #fff9c4 8px, #fff9c4 16px) !important;
}

How to use this example

1. Copy the code with the button above.
2. Install JustZix (2 minutes) and open the extension on the target page.
3. Add a new rule matching that page.
4. Paste the code into the rule's CSS panel and save — the effect appears instantly.