rounded-lg

The rounded-lg class in Tailwind CSS applies a large border-radius to all four corners of an element. It's useful when you want smoother, more pronounced rounding for buttons, cards, containers, or UI elements.

Syntax

<div class="rounded-lg">...</div>

Example Code

<div class="bg-white p-6 rounded-lg shadow">
  This card has large, smooth rounded corners.
</div>

Preview

Use rounded-lg when you want a visibly rounded look for all corners of an element. It's great for modern UIs where smooth, clean edges improve visual polish and user experience.