## Examples

### Primary

<elements-example>

```html
<w-link variant="primary" href="#">Go to the top of this page</w-link>
```

</elements-example>

### Secondary

This is the default appearance.

<elements-example>

```html
<w-link href="#">Go to the top of this page</w-link>
```

</elements-example>

### Negative

<elements-example>

```html
<w-link variant="negative" href="#">Go to the top of this page</w-link>
```

</elements-example>

### Utility

<elements-example>

```html
<w-link variant="utility" href="#">Go to the top of this page</w-link>
```

</elements-example>

### Quiet

<elements-example>

```html
<w-link variant="quiet" href="#">Go to the top of this page</w-link>
```

</elements-example>

### Small

All variants can be small.

<elements-example>

```html
<w-link href="#" small>Go to the top of this page</w-link>
```

</elements-example>

### Full width


<elements-example>

```html
<w-link href="#" full-width>Go to the top of this page</w-link>
```

</elements-example>