⚡ Overview

Prism Shadow Studio is a visual playground for depth in UI. Stack multiple box-shadow layers with full control, generate smooth multi-layer shadows from a few sliders, or design frosted-glass cards with backdrop blur. The preview updates live and the code is ready to paste.

✨ Features

• Multi-layer box-shadow editor: X, Y, blur, spread, color, opacity, inset
• Smooth shadow generator with doubling layers for natural falloff
• Glassmorphism with blur, saturation, tint, border and radius
• Presets: Soft, Neon, Lifted, Inner, Brutal, Sunset glow
• CSS and Tailwind output, custom stage background
• State saved locally

📸 Screenshots

🚀 Quick Start

Use it online: https://krishyaa06.github.io/prism-shadow-studio/

Run locally:

git clone https://github.com/krishyaa06/prism-shadow-studio.git
cd prism-shadow-studio
# open index.html in your browser, or serve it:
npx serve .

🛠️ Usage

• Box shadow: add layers and tune each one; toggle inset for inner shadows.
• Smooth shadow: pick layers, distance, blur and strength.
• Glassmorphism: adjust blur and opacity over the colorful background.
• Switch CSS / Tailwind and hit Copy.

📁 Project Structure

prism-shadow-studio/
├── assets/
│   ├── logo.png
│   └── logo.svg
├── css/
│   ├── app.css
│   └── prism.css
├── js/
│   ├── app.js   # editor UI
│   ├── core.js   # shadow + glass CSS generation — tested in Node
│   └── prism.js
├── test/
│   └── core.test.js
├── .gitignore
├── LICENSE
├── README.md
├── index.html
└── package.json

🧪 Tests

npm test

Tests use the built-in node:test runner, so there is nothing to install. CI runs them on Node 20 and 22.

🤝 Contributing

1. Fork the repo and create a branch: git checkout -b feature/my-idea
2. Make your change and add a test in test/
3. Run npm test and open a Pull Request

🔷 Part of Prism Protocol

Prism Shadow Studio is one of the open-source tools built by Prism Protocol, a tech community where young builders learn, ship and compete together.

👤 Author

Soumya Bhandare Founder @ Prism Protocol

📄 License

Released under the MIT License.

If you like this project, consider giving it a ⭐
_{"Build. Create. Compete." · Made with ⚡ by Prism Protocol}