Shadow.css, Adding shadows to your website for aesthetic look.

ShadowCSS

One more framework to make your websites look beautiful! Useful and modern CSS Shadow framework.

Table of contents

• Smooth Shadow
• Sharp Shadow
• Square Shadow
• Neon Effects
• Text Shadows
• Hover Animations

Usage [RAW]

<link rel="stylesheet" href="https://raw.githubusercontent.com/omer571-sys/shadow.css/main/shadow-1.1.min.css">

Creators

Ömer Faruk IŞIK

• https://twitter.com/merFaru95465644
• https://github.com/omer571-sys/

Effects

Smooth Shadows

<div class="box-shadow centered-smooth-sm">Smooth Shadows</div>

box-shadow centered-smooth-sm
box-shadow centered-smooth-md
box-shadow centered-smooth-lg
box-shadow top-left-smooth
box-shadow top-smooth
box-shadow top-right-smooth
box-shadow bottom-left-smooth
box-shadow bottom-smooth
box-shadow bottom-right-smooth

Smooth Shadow Animations

<div class="box-shadow centered-smooth animation-top">Smooth Shadows</div>

box-shadow centered-smooth animation-top-left
box-shadow centered-smooth animation-top
box-shadow centered-smooth animation-top-right
box-shadow centered-smooth animation
box-shadow centered-smooth animation-bottom-left
box-shadow centered-smooth animation-bottom
box-shadow centered-smooth animation-bottom-right
box-shadow top-left-smooth animation
box-shadow top-smooth animation
box-shadow top-right-smooth animation
box-shadow bottom-left-smooth animation
box-shadow bottom-smooth animation
box-shadow bottom-right-smooth animation

Sharp Shadows

<div class="box-shadow top-sharp">Sharp Shadows</div>

box-shadow centered-sharp-sm
box-shadow centered-sharp-md
box-shadow centered-sharp-lg
box-shadow top-left-sharp
box-shadow top-sharp
box-shadow top-right-sharp
box-shadow bottom-left-sharp
box-shadow bottom-sharp
box-shadow bottom-right-sharp

Sharp Shadows Animations

<div class="box-shadow centered-sharp animation-top">Sharp Shadows Animations</div>

box-shadow centered-sharp animation-top-left
box-shadow centered-sharp animation-top
box-shadow centered-sharp animation-top-right
box-shadow centered-sharp animation
box-shadow centered-sharpanimation-bottom-left
box-shadow centered-sharp animation-bottom
box-shadow centered-sharp animation-bottom-right
box-shadow top-left-sharpanimation
box-shadow top-sharpanimation
box-shadow top-right-sharpanimation
box-shadow bottom-left-sharpanimation
box-shadow bottom-sharpanimation
box-shadow bottom-right-sharpanimation

Square Shadow

<div class="box-shadow top-left-square-sm">Square Shadow</div>

box-shadow top-left-square-sm
box-shadow top-square-sm
box-shadow top-right-square-sm
box-shadow bottom-left-square-sm
box-shadow bottom-square-sm
box-shadow bottom-right-square-sm

Neon Shadows

<div class="box-shadow neon-green-sm">NEON</div>

box-shadow neon-green-sm
box-shadow neon-red-md
box-shadow neon-blue-lg

Text Shadows

<div class="text-shadow">NEON</div>

Copyright and license

Code and documentation copyright 2020-2021 the Ömer Faruk IŞIK. Code released under the MIT License.