@react-theming/theme-swatch

Install

npm i @react-theming/theme-swatch

Usage

import { createSwatch } from '@react-theming/theme-swatch';
/* you need to provide a `styled` functions from Styled Components, Emotion or '@storybook/theming'  */
import styled from '@emotion/styled';

const ThemeSwatch = createSwatch(styled);

colors = ['red', 'green', '#13f0b7', 'rgb(100,180,250)'];

const YourComponent = () => {
  return <ThemeSwatch theme={colors} size={64} />;
};

Credits

Created with ❤︎ to React and CSS-in-JS by @usulpro [React Theming]