# Gradients

WIP

- HTML
- View
- Context
- Assets
- Info
- Notes

`

    <div class="demo">
        <div class="stripe stripe--gradient" style="height: 20rem;">
            <h1>Gradient 1</h1>
        </div>
        <div class="stripe stripe--gradient-2" style="height: 20rem;">
            <h1>Gradient 2</h1>
        </div>
    </div>

`
`

    <div class="demo">
        <div class="stripe stripe--gradient" style="height: 20rem;">
            <h1>Gradient 1</h1>
        </div>
        <div class="stripe stripe--gradient-2" style="height: 20rem;">
            <h1>Gradient 2</h1>
        </div>
    </div>

`
`

    /* No context defined. */

`
File:

- Content:
  `

      $gradient: linear-gradient(360deg, rgba(255, 230, 217, 1) 23%, rgba(255, 156, 102, 1) 60%);
      $gradient-2: linear-gradient(180deg, $brand-primary-25 0%, $brand-gray-10 100%);

  `
- URL: /components/raw/gradients/_gradients.scss
- Filesystem Path: components/06-subatoms/gradients/_gradients.scss
- Size: 173 Bytes

- Handle: @gradients
- Preview:
  - With layout
  - Component only
- Filesystem Path: components/06-subatoms/gradients/gradients.html

No notes defined.