generateSimpleGradient

View on GitHub

import { generateSimpleGradient } from '@sky-uk/ui-core';

You should read about the gradients theme function before using this utility.

generateSimpleGradient is a utility that can convert an Array of colour stops into a gradient.

This is useful if you are building your own gradient.

Select background colour

() => {
  const MyComponent = styled.div`
    background-image: ${generateSimpleGradient("to left", ["red", "white"])};
    height: 32px;
    width: 100%;
  `;

  return <MyComponent />;
}

() => {
  const MyComponent = styled.div`
    background-image: ${generateSimpleGradient("to left", ["red", "white"])};
    height: 32px;
    width: 100%;
  `;

  return <MyComponent />;
}