ZeonTools
360° Neumorphism Lighting Engine
Standard shadow generation uses black or dark grays to simulate ambient occlusion. Neumorphism (Soft UI) is a massive design trend that relies on creating the illusion that the UI element is extruded directly out of the background plastic.
This requires calculating two distinct shadows: a bright highlight on the side facing the light source, and a dark shadow on the opposite side. If you click our Neumorphism Preset, the engine switches modes. It mathematically parses your selected base color, calculates its HSL luminance, and generates the perfect opposing hex codes to create this extrusion effect, eliminating the difficult color math for developers.
Exporting CSS Variables (Design Tokens)
Professional design systems do not hardcode box-shadow rules directly onto classes. Modern architecture utilizes CSS Custom Properties (Variables) to define elevations (e.g., --elevation-1, --elevation-2). This makes implementing dark mode toggles significantly easier.
Our Level 4 Blender supports exporting Design Tokens. When you switch the export format to CSS Variables, it generates a :root block mapping your Resting and Hover shadow arrays to global variables, and then assigns those variables to the target class, providing enterprise-grade boilerplate instantly.
Why Layered Box-Shadows Look Better
In the real world, light doesn't diffuse linearly; it diffuses logarithmically. The shadow immediately touching an object is dark and sharp, while the shadow cast further away is incredibly soft and transparent. To simulate this in CSS, you must stack multiple box-shadow declarations separated by commas. Our Blender mathematically calculates easing curves to generate up to 10 layered shadows, resulting in buttery-smooth depth.
Generating Hover State Animations
Our Hover Interpolation Engine allows you to design both Resting and Hover states independently. When you copy the output, it generates the complete boilerplate, including the transition: box-shadow 0.3s ease; rule, ensuring the browser can smoothly interpolate the complex multi-layer math between your two states.