Prisma saysfilter applies graphic effects — blur, brightness, contrast, grayscale, drop-shadow — to an element.
filter runs image-style effects on any element: blur(4px), brightness(1.2), contrast(), grayscale(), hue-rotate(), drop-shadow() (which follows the alpha shape, unlike box-shadow). Chain multiple in one declaration. GPU-accelerated and animatable.
Power-ups you unlock
blur, brightness, contrast, grayscale, hue-rotate
drop-shadow follows the element’s alpha shape
Chain several filters in one value
Animatable and GPU-accelerated
Jank the Janitor attacks — common mistakes
Heavy blur on large areas (performance cost)
Confusing drop-shadow with box-shadow
Filters affecting children unexpectedly
Boss battleGrayscale an image and restore full color on hover with a transition.