export const meta = {
  addons: ['tachyons-gradients'],
  modules: ['tachyons-gradients'],
  subNav: 'addons',
  title: 'Gradients / Addons / Docs / TACHYONS',
  editUrl: 'https://github.com/tachyons-css/tachyons/edit/master/docs/addons/gradients.md'
}

# Gradients

![Addon](https://img.shields.io/badge/TACHYONS%20ADDON-✓-brightgreen.svg?longCache=true&style=for-the-badge)

Tachyons includes a gradients addon.
The gradients are intended to be sensible defaults for most projects.
They've been created by the extremely talented folks at [cssgradient.io](https://cssgradient.io).

These provided gradients are a starting point for projects, we expect most projects customize this addon for their own needs.

## Examples

### Charcoal

```.html
<div class="pa5 gradient-charcoal"></div>
```

### Dark blue

```.html
<div class="pa5 gradient-dark-blue"></div>
```

### Moon gray

```.html
<div class="pa5 gradient-moon-gray"></div>
```

### Lily

```.html
<div class="pa5 gradient-lily"></div>
```

### Aqua

```.html
<div class="pa5 gradient-aqua"></div>
```

### Purple

```.html
<div class="pa5 gradient-purple"></div>
```

### Green

```.html
<div class="pa5 gradient-green"></div>
```
