A Few Fun CSS Properties and Functions

CSS filter property

The CSS filter property allows you to apply visual effects to HTML elements such as changing colors, brightness, contrast, etc. It's a powerful tool for creating unique and eye-catching designs.

Usage:

filter: brightness(2);

CSS blur filter function

The CSS blur filter function allows you to add a blur effect to HTML elements. It can be used to soften or obscure elements, making the overall design more visually interesting. The function is applied using the "blur()" value within the "filter" property in CSS.

Usage:

filter: blur(0.25em);

CSS "where" function

The CSS "where" function is a logical operator that enables conditional statements in CSS, allowing developers to apply styles to elements based on certain conditions. The "where" function is a powerful tool for creating dynamic, responsive designs.

Usage:

a:where(:not(:hover)) {
  text-decoration: none;
  color: blue;
}