MANTIS NEURO / MATERIAL TOOLKIT

Chrome, skin,
and a little light.

A working set of design studios and technical references for the Mantis identity. Keep photographs, hardware details, and reading sharp. Place texture in the background and concentrate refraction at an object's edge.

01 / Ditther ↗

Use the browser editor for fine dither, halftone, duotone, and restrained grain studies. Start with Mantis-owned artwork or an original gradient. Apply texture to a background or a narrow material sample, then compare it with the untouched portrait.

Direction: wine ink + pearl · fine Bayer grain · low effect opacity · crisp subject

02 / Pryzm ↗

Explore gradient, glass, and grain combinations. For Mantis, start with a rose-to-pearl gradient, use a narrow fluted-glass band, and keep blur off. A small blush reflection can make the surface feel less clinical.

Direction: gradient → fluted glass → fine grain · slow movement · no broad haze

Export requires an account; live HTML, React, and Framer export is a Pro feature. The current Mantis background is an original shader informed by these techniques, not a Pryzm export.

03 / CodePen ↗

Lyra Rebane's CSS/SVG glass experiment is a useful reference for displacement, curvature, and iridescence. Study the effect in isolation before applying it to a live page. Keep mobile filter areas small and preserve licensing when reusing public Pen code.

A second lens experiment by mr-tipton · CodePen licensing

04 / Still Life direction ↗

Andreion de Castro's creative-coding studies combine dithering with subtle movement, light, shadow, and color. Mantis translates that principle into an original moving-light shader on a cel-shaded cyberpunk portrait: fixed Bayer patterns in darker tones, slow light planes, and pointer response. The illustrated headband is excluded from the effect. No source pixels are displaced.

Still Life Tool was requested as a reference. Its page could not be inspected in this environment, so no editor export, API integration, or software license is claimed.

05 / FXAA ↗

The aescripts product is an After Effects edge-smoothing plugin. The website uses the official Three.js FXAA shader locally to smooth jagged edges in its actual B4 product view. It does not run the After Effects plugin. Edge smoothing follows tone mapping and color conversion, without bloom or a defocus filter.

Scene → ACES / sRGB → FXAA · physical-pixel resolution · unchanged B4 geometry

The glass engine in Mantis

Deepika Rao's liquid-glass.js supplies the actual refraction. Seven small controls use its unchanged MIT runtime. Large image frames use original reflective bezels and pointer-responsive glints. Chromium gets SVG backdrop refraction; Safari and Firefox receive a lightweight CSS fallback.

blur: 0 · chroma: 1.7 · mapBlur: 3 · border: 0.085 · scale: −26 to −44

The site retains its pause control, reduced-motion handling, and solid surfaces for reduced transparency. No full-page snapshots or remote runtime dependencies are used.