Skip to main content
100%

No grayscale for me

✓ Published0🌍 Public
Aadkdev
Last edited Oct 2, 2017
Created on Oct 19, 2016

This example demonstrates a Tampermonkey userscript that forces any website to display without grayscale filtering. It shows the direct application of CSS `filter: grayscale(0%)` onto both the `<html>` and `<body>` elements, overriding any site-wide grayscale effects. The script runs on every URL via the `@include *://*/*` pattern, excluding image file extensions, and executes immediately when the page loads. It relies on the Tampermonkey extension’s userscript API and plain DOM manipulation through `document.getElementsByTagName()`.

AI-generated description

Similar vizzes

Loading thumbnail…

Userscript : Pantip White Theme

This userscript applies a white theme to Pantip topic pages, overriding the site’s default colors for readability. It shows how a Tampermonkey script can manipulate the DOM and CSS styles across both mobile and desktop layouts, using jQuery selectors like `$()` and `$$()` to target elements such as post boxes, comment sections, and related-topic blocks. The script also removes ads, resizes related images via a Google proxy URL, and re-applies styling after AJAX updates, relying on `unsafeWindow` and `ajaxSuccess` hooks.

Aadkdev
59% match
Loading thumbnail…

Greasemonkey script to restore URL view in Google search

This example demonstrates a Greasemonkey userscript that restores full URLs in Google search results, replacing the displayed site names with the actual hyperlink addresses. It targets search result pages across multiple Google domains. The script selects all `cite` elements, which typically show shortened or breadcrumb URLs, and overwrites their text content with the parent link’s `href` attribute using the standard DOM API `querySelectorAll` and `textContent`. No external libraries are used; it relies purely on vanilla JavaScript and the Greasemonkey userscript engine to run automatically on matching pages.

TThomasG77
55% match
Loading thumbnail…

Conic Gradient

This example demonstrates a conic gradient rendered as a full-page background using pure CSS. The body element fills the viewport with a conic-gradient that transitions from gold to red, creating a smooth circular color wheel effect. The code uses the CSS `conic-gradient()` function within a simple HTML structure, with no JavaScript or external libraries. It draws directly from MDN’s documentation on CSS gradients, showcasing a minimal approach to generating complex color transitions without canvas or SVG.

CCurran Kelleher
51% match
Loading thumbnail…

Gist 962cd79b5bff0c8b28a25691831eb7f0

This example displays a grid-patterned background for a web page, rendered using CSS on an HTML body element. It shows a repeating tiled texture created by an external image file called `bk.png`. The code sets the background image and applies initial positioning, sizing, and repetition properties to control how the pattern displays across the viewport. Using standard CSS background properties, it establishes a simple, static visual foundation without any interactive or animated elements, relying solely on the bitmap image for its appearance.

RRainboylvx
51% match
Loading thumbnail…

[Run it!](https://bl.ocks.org/curran/raw/3184b45f555dae6bebb1536110763824/)

This example displays a live webcam feed as an immersive digital mirror, filling the entire viewport with the video stream. It uses the MediaDevices `getUserMedia` API to request camera access and the `webrtc-adapter` library for cross-browser compatibility, with `window.URL.createObjectURL` to bind the stream to an HTML5 video element. The page relies on minimal CSS and JavaScript, drawing from the camera-control techniques in David Walsh’s tutorial and the MDN documentation for media capture.

CCurran Kelleher
50% match
Loading thumbnail…

fullscreen.js, no dependency

This example demonstrates how to add a fullscreen toggle button to any web page, showing a persistent user interface control that enables immersive viewing. The code appends a clickable “Fullscreen” button to the document body, leveraging the native browser fullscreen API through vendor-prefixed methods like `webkitRequestFullScreen` and `mozRequestFullScreen` to handle cross-browser support. On activation or exit, it triggers a redraw of the page after 200 milliseconds to refresh the visualization. The button label changes to a multiplication sign when in fullscreen mode, reflecting the current state via the `fullscreenchange` event listener.

PPhilippe Rivière
50% match
Loading thumbnail…

Untitled

This example presents a single, large monospaced line of text that changes color from black to red. It demonstrates a minimal typographic interaction using plain HTML and CSS, with no external libraries or JavaScript. The visible data is the text itself, which the viewer reads as a static sentence; the only dynamic behavior is the style change triggered by a user action, such as hovering or clicking. The rendering relies on the browser’s default text layout, with the `:hover` or `:active` pseudo-class from CSS providing the color transition.

Ggavriel-binshtok
50% match
Loading thumbnail…

SCSS mixing for CSS3 gradients

This example shows how to define a reusable gradient mixin in SCSS that generates CSS3 gradients with cross-browser support. The mixin takes two color arguments and outputs background-color as a fallback, followed by gradient declarations for Mozilla, WebKit, Opera, and the standard syntax. The code uses the `@mixin` and `@include` directives from Sass, applying the mixin to a `.my_div` class with a `$background_color` variable and white. It does not include any data source or rendering logic, only the styling approach for gradients.

Aackuser
50% match