✦ Cinematic · Pure CSS/SMIL · Zero JavaScript

Notifications, told as motion.

A library of cinematic SVG notifications — film-grain texture, hand-drawn displacement, luxurious easing. Each one self-contained, infinitely scalable, with not a line of JavaScript.

We treat every notification not as a popup, but as a small film.

Pure CSS / SMIL

Zero JavaScript

Every animation lives inside the SVG file — keyframes and SMIL, no runtime, no library. It keeps moving inside a plain <img> tag on any page.

Render by reference

Infinitely scalable

Cards load each notification as a lazy <img>; the gallery reads one manifest. Fifty or five hundred, the page stays smooth.

Crafted, not generated

Kept only when good

Film grain, displacement-map edges and 5-second easing, made one at a time and judged — never a batch dump.

Notification toasts

Functional UI toasts — success, alert, complete, sent — each a wide self-contained component that drops straight into a product. Shown here the way they'd actually appear.

Questions, answered

What these cinematic SVG notifications are, why they need no JavaScript, and how to drop one into your own product.