Site Grayscale Mode

Site Grayscale Mode lets you add a CSS-based grayscale filter to your website with full control over intensity. It is designed for site owners who need to temporarily or permanently display content in grayscale, such as during moments of remembrance or accessibility preferences.

Adjustable intensity – Set the grayscale level from 0% to 100% via the settings page. The filter applies smoothly to all visible content.

Visitor toggle button – Site visitors can enable or disable grayscale with a single click. Their preference is saved in the browser using local storage, so it persists across visits.

Shortcode support – Place [grayscale_toggle] anywhere in your content to let users switch modes on demand. Works in posts, pages, and widgets.

Optional admin grayscale – Extend the filter to the WordPress dashboard (wp-admin) for a consistent experience. This setting is disabled by default.

Exclude specific elements – Add the CSS class .no-grayscale to any element to keep it in full color, even when grayscale is active.