Mint Fog Cafe Wall

CSSLight

A slow cafe wall illusion that tilts and shifts under the eye. Pure CSS.

#op-art#illusion#css#cafewall#mint-fog

Live preview

2 files

import "./optical.css";

// Render <Optical /> inside a container with position: relative.
export function Optical() {
  return <div className="optical-bg optical-bg--light" />;
}

Copy or download any file. The HTML build loads Three.js from a CDN via an import map, so it runs by just opening index.html. The React build is react-three-fiber; setup notes live at the top of each file.

Variants

40 of this pattern · page 1 of 4