function linearGradient(_ref) {
    var colorStops = _ref.colorStops,
      fallback = _ref.fallback,
      _ref$toDirection = _ref.toDirection,
      toDirection = _ref$toDirection === void 0 ? '' : _ref$toDirection;
    if (!colorStops || colorStops.length < 2) {
      throw new PolishedError(56);
    }
    return {
      backgroundColor: fallback || colorStops[0].replace(/,\s+/g, ',').split(' ')[0].replace(/,(?=\S)/g, ', '),
      backgroundImage: constructGradientValue(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose__default["default"](["linear-gradient(", "", ")"])), toDirection, colorStops.join(', ').replace(/,(?=\S)/g, ', '))
    };
  }
CSS for declaring a linear gradient, including a fallback background-color. The fallback is either the first color-stop or an explicitly passed fallback color.

@example
// Styles as object usage
const styles = {
  ...linearGradient({
          colorStops: ['#00FFFF 0%', 'rgba(0, 0, 255, 0) 50%', '#0000FF 95%'],
          toDirection: 'to top right',
          fallback: '#FFF',
        })
}

// styled-components usage
const div = styled.div`
  ${linearGradient({
          colorStops: ['#00FFFF 0%', 'rgba(0, 0, 255, 0) 50%', '#0000FF 95%'],
          toDirection: 'to top right',
          fallback: '#FFF',
        })}
`

// CSS as JS Output

div: {
  'backgroundColor': '#FFF',
  'backgroundImage': 'linear-gradient(to top right, #00FFFF 0%, rgba(0, 0, 255, 0) 50%, #0000FF 95%)',
}