drop-shadow-lg

The drop-shadow-lg class belongs to the drop shadow group within the filters category.

Example Usage

Here is an example of how to use drop-shadow-lg:

<div class="sm:flex sm:space-x-4">
  <img src="/placeholders/mountain.jpg" class="rounded-lg h-48 w-48 drop-shadow-lg grayscale-0">
  <img src="/placeholders/mountain.jpg" class="rounded-lg h-48 w-48">
</div>

Resulting CSS

--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);

Other Drop shadow Classes

drop-shadow drop-shadow-2xl drop-shadow-md drop-shadow-none drop-shadow-sm drop-shadow-xl

View other Filters classes

Get Tailwind Scanner!

The absolute must-have tool for anyone using Tailwind CSS.

Scan, Edit, Export any tailwind site in browser to create the perfect UI - download the chrome extension!