Welcome to the CSS Box Shadow Generator, where generating shadows is serious business... except when it's not! 😎
- To run localy open
index.html
and let the sliders do the shadow dance. - Revel in the live preview, showcasing the shadowy masterpiece.
- Witness the magic as the CSS code materializes in the output section.
- Optionally, perform the daring act of copying the CSS code using the "Copy" button.
- Horizontal Offset Slider: Shifty business for that horizontal charm.
- Vertical Offset Slider: For those who like to keep things high or low.
- Blur Radius Slider: Because sometimes life needs a little blur.
- Spread Radius Slider: Spreading the love, or shadow, if you will.
- Opacity Slider: Making things mysteriously transparent.
- Color Picker: Where rainbows meet shadows; choose your hue!
- Copy to Clipboard: One click to rule them all.
Watch in awe as the sliders transform mere numbers into a visual symphony of shadows. The preview box displays the avant-garde shadow performance, while the generated CSS code stands as a testament to the harmonious collaboration of pixels.
- None whatsoever! This project is like a lone wolf, howling at the moon of independence. Google Fonts may join the party, but it's just a plus-one, not a requirement. 🌕
- index.html: The magician's stage where the shadow spectacle unfolds.
- style.css: Styling, because shadows deserve to look good too.
- main.js: The conductor orchestrating the shadow symphony.
- colorConverter.js: Provides color conversion for compatibility between browsers
This project is not just open source; it's open-shadow! Feel free to bask in the glory of shadowy creativity.
Inspiration for this project came from the shadows themselves, who whispered, "Let there be style, and let it cast a magnificent shadow!" 🌑