← All examples

Etsy: dim sold-out listings

Greys out and dims listings marked as sold out so the available products stand out more.

Code to copy

/* Dim sold-out listings so available items stand out */
.listing-card:has([data-sold-out]),
.listing-card:has(.wt-badge[aria-label*="Sold out" i]),
[data-listing-id]:has(.sold-out-overlay) {
  opacity: 0.45 !important;
  filter: grayscale(60%) !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.