Free · copy-paste · render-tested

Effect recipes your AI can't fake

Ask an AI for “liquid glass” and you get a blur. These are hand-made: real technique, browser fallbacks, reduced-motion support and notes on when not to use them. Copy one, or let a Slopcheck review pick the right ones for your site.

• Surface

  Liquid glass

  A real lens: the backdrop refracts at the rounded rim and stays sharp in the middle, with a specular edge — not just a blur.

• Surface

  Frosted glass (done right)

  Blur that keeps the color underneath, a hairline rim and fine grain — a material, not grey mush — with opaque fallbacks.

• Texture

  Film grain overlay

  A barely-there noise layer that makes flat gradients and big color fields feel printed and human instead of rendered.

• Texture

  Brand mesh gradient

  Soft, slowly drifting color fields built from your own palette — atmosphere without the violet-cyan AI glow.

• Motion

  Masked word reveal

  Headline words rise out of their own masked line boxes, staggered — typographic motion instead of the default fade-up on everything.

• Interaction

  3D tilt with light

  A card that leans toward the pointer with a soft moving highlight — makes a real product shot feel physical.

• Interaction

  Magnetic button

  The primary CTA leans toward the cursor with its label moving a bit further, then springs back — playful, physical, and only where it matters.

• Motion

  Seamless marquee

  A CSS-only endless ticker with faded edges that pauses on hover and becomes a static row for reduced motion.