Light Neuro Pressed Box Shadow CSS

An inset pressed effect for light UI controls.

box-shadow

Preview Surface

Output

Copy-ready CSS

Pure CSS

box-shadow: inset 8px 8px 18px -12px rgba(148, 163, 184, 0.42), inset -8px -8px 18px -12px rgba(255, 255, 255, 0.9);

Tailwind v4

shadow-[inset_8px_8px_18px_-12px_rgb(148_163_184_/_0.42),_inset_-8px_-8px_18px_-12px_rgb(255_255_255_/_0.9)]

Try it in the generator Open encoded state

When to use it

Light Neuro Pressed is a neumorphism box-shadow preset built for soft bevel contrast. It uses 2 shadow layers to create a light effect that is easy to copy into product cards, dashboards, marketing blocks, and small interface surfaces. An inset pressed effect for light UI controls. The shadow is intentionally described as plain CSS, so you can paste it into any framework or convert it into a Tailwind arbitrary value without changing the visual result. It includes 2 inset layers, so it can make a surface feel pressed into the canvas instead of floating above it. Use it when you want a repeatable starting point, then open it in the generator to adjust offset, blur, spread, color, opacity, or stacked layers for your own layout.

Hexpedia