Skip to content

Aron-Lomner/css-box-shadow-generator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CSS Box Shadow Generator

Welcome to the CSS Box Shadow Generator, where generating shadows is serious business... except when it's not! 😎

Usage

  1. To run localy open index.html and let the sliders do the shadow dance.
  2. Revel in the live preview, showcasing the shadowy masterpiece.
  3. Witness the magic as the CSS code materializes in the output section.
  4. Optionally, perform the daring act of copying the CSS code using the "Copy" button.

Features

  • 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.

How It Works

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.

Dependencies

  • 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. 🌕

File Structure

  • 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

License

This project is not just open source; it's open-shadow! Feel free to bask in the glory of shadowy creativity.

Acknowledgments

Inspiration for this project came from the shadows themselves, who whispered, "Let there be style, and let it cast a magnificent shadow!" 🌑