Lesson 26 of 3087%

(Progress persistence is disabled until Phase 9)

Tailwind CSS
Beginner

Shadows

Applying box shadows.

Tailwind’s shadows are beautifully calibrated out of the box.

  • shadow-sm
  • shadow
  • shadow-md
  • shadow-lg
  • shadow-xl
<div class="bg-white p-6 shadow-lg rounded-xl max-w-sm mx-auto mt-10">
  <h3 class="text-lg font-bold">Floating Card</h3>
</div>
Try It Yourself

Lesson Progress

Ready to practise?

Apply what you learned with a hands-on challenge.

Practise This Topic