rounded-l

The rounded-l class in Tailwind CSS applies the default border-radius to the left side of an element — affecting both the top-left and bottom-left corners. It's commonly used when styling buttons, input groups, or cards that require soft edges only on one side.

Syntax

``html

## Example Code

```html
<div class="flex">
  <button class="bg-gray-300 px-4 py-2 rounded-l">Prev</button>
  <button class="bg-blue-600 text-white px-4 py-2 ">Next</button>
</div>

Preview

This adds a smooth radius to only the left side of the "Prev" button, often useful in paired or grouped buttons.