# Rounds

### XSmall (2px)

Just add **sl-rounded-xs** class.

```markup
<div class="sl-rounded-xs">
```

### Small (4px)

Just add **sl-rounded-sm** class.

```markup
<div class="sl-rounded-sm">
```

### Medium (6px)

Just add **sl-rounded-md** class.

```markup
<div class="sl-rounded-md">
```

### Large (8px)

Just add **sl-rounded-lg** class.

```markup
<div class="sl-rounded-lg">
```

### XLarge (10px)

Just add **sl-rounded-xl** class.

```markup
<div class="sl-rounded-xl">
```

### Circle

Just add **sl-rounded-circle** class.

```markup
<div class="sl-rounded-circle">
```

### Pill

Just add **sl-rounded-pill** class.

```markup
<div class="sl-rounded-pill">
```