shadow-blue-400

The shadow-blue-400 class belongs to the box shadow color group within the effects category.

Example Usage

Here is an example of how to use shadow-blue-400:

<div class="bg-gray-300 w-48 h-48 flex items-center justify-center">
  <div class="shadow-2xl shadow-blue-400 p-4 w-32 h-32 rounded-lg bg-white"></div>
</div>

Resulting CSS

--tw-shadow-color: #60a5fa;
--tw-shadow: var(--tw-shadow-colored);

Other Box shadow color Classes

shadow-amber-100 shadow-amber-200 shadow-amber-300 shadow-amber-400 shadow-amber-50 shadow-amber-500 shadow-amber-600 shadow-amber-700 shadow-amber-800 shadow-amber-900 shadow-amber-950 shadow-black shadow-blue-100 shadow-blue-200 shadow-blue-300 shadow-blue-50

View other Effects classes View all Box shadow color 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!