Loading...
AI
Git
Database
Math
Images
Frontend
DNI
Finance
Converters
Mock Data
Security
Dev Tools
Text Tools
Crypto & Hashing
UUID
Vehicles
Machine
Passport
Password
Bar Code
Invoicing
Network
Infrastructure
SEO
Productivity
Design natural, physics-inspired multi-layered CSS box-shadows and Tailwind elevation presets
Load curated multi-step lighting presets for modern UI components
Adjust elevation, layers, ambient blur, and light source angle
box-shadow: 0px 1.4px 2.5px -0.5px rgba(15, 23, 42, 0.064), 0px 5.8px 10.4px -1px rgba(15, 23, 42, 0.056), 0px 13.7px 24.7px -1.5px rgba(15, 23, 42, 0.048), 0px 25px 45px -2px rgba(15, 23, 42, 0.041);
// In tailwind.config.js (theme.extend.boxShadow)
boxShadow: {
'layered': `0px 1.4px 2.5px -0.5px rgba(15, 23, 42, 0.064), 0px 5.8px 10.4px -1px rgba(15, 23, 42, 0.056), 0px 13.7px 24.7px -1.5px rgba(15, 23, 42, 0.048), 0px 25px 45px -2px rgba(15, 23, 42, 0.041)`,
}:root {
--shadow-layered: 0px 1.4px 2.5px -0.5px rgba(15, 23, 42, 0.064), 0px 5.8px 10.4px -1px rgba(15, 23, 42, 0.056), 0px 13.7px 24.7px -1.5px rgba(15, 23, 42, 0.048), 0px 25px 45px -2px rgba(15, 23, 42, 0.041);
}