Elegant CSS Box Shadows Ideas

Created: 5th Aug 23 1 Views
Review needed
Verified
Loading...
Loading...
Comments

  • 1. The Thick Shadows

    1. Thick Shadows

    CSS Code:

    { box-shadow: rgba(150, 150, 150, 0.5) 5px 5px 55px; width:200px; height:200px }





  • 2. The Thin Shadows

    2. Thin Shadows

    CSS Code:

    { box-shadow: rgba(150, 150, 150, 0.2) 1px 1px 1px; width:200px; height:200px; }





  • 3. The Dark Knight Shadows

    3. Dark Knight Shadows

    CSS Code:

    { box-shadow: rgba(10, 10, 10, 0.25) 1px 1px 10px, rgb(51, 51, 51) 2px 2px 2px 2px; }





  • 4. The Shadow Left

    4. Left Shadow

    CSS Code:

    { box-shadow: rgba(150, 150, 150, 0.5) -20px 5px 40px; width:200px; height:200px }





  • 5. The Fineline Shadow

    5. Fineline Shadow

    CSS Code:

    { box-shadow: rgba(0, 0, 0, 0.23) 0px 1px 3px 0px, rgba(20, 20, 30, 0.15) 0px 0px 0px 1px; width:200px; height:200px }





  • 6. The Inverted Shadow

    6. Inverted Shadow

    CSS Code:

    { box-shadow: rgba(35, 35, 80, 0.30) 0px 32px 52px -10px inset, rgba(0, 0, 0, 0.25) 0px 15px 30px -12px inset;; width:200px; height:200px }





  • 7. Shadows of Enigma

    7. Shadows of Enigma

    CSS Code:

    { box-shadow: rgba(0, 0, 80, 0.25) 0px 3px 6px -1px, rgba(0, 0, 0, 0.35) 0px 1px 3px -1px; width:200px; height:200px }





  • 8. The Misty Shadows

    8. Misty Shadows

    CSS Code:

    { box-shadow: rgba(10, 20, 30, 0.15) 1px 2px 4px 1px, rgba(10, 20, 30, 0.35) 1px 2px 15px 0px;; width:200px; height:200px }





  • 9. The Curvy Shadows

    9. Curvy Shadows

    CSS Code:

    { box-shadow: rgba(15, 15, 25, 0.1) 0px 1px 0px, rgba(15, 15, 25, 0.1) 1px 9px 20px, rgba(15, 15, 25, 0.1) 0px 15px 40px; border-radius:10px; width:200px; height:200px }





  • 10. The Red Shadows

    10. Red Shadows

    CSS Code:

    { box-shadow: rgba(255, 0, 0, 0.25) 0px 2px 5px -1px, rgba(255, 0, 0, 0.3) 0px 1px 3px -1px; ; border-radius:10px; width:200px; height:200px }

    • Elegant Awesome CSS Box Shadows Ideas

    Comments & Discussion

    Facing issues? Have questions? Post them here! We're happy to help!

Latest Posts
More Posts
    Random Posts