ibodev1 / tailwindcss-palette-generator Goto Github PK

/** @type {import('tailwindcss').Config} */
import getPalette from "tailwindcss-palette-generator";

const palette = getPalette([
  {
    color: "#264653",
    name: "primary"
  },
  {
    color: "#2a9d8f",
    name: "secondary"
  },
  {
    color: "#e9c46a",
    name: "sun"
  },
  {
    color: "#f4a261",
    name: "lightorange"
  },
  {
    color: "#e76f51",
    name: "orange"
  }
]);

module.exports = {
  content: [
    "./app/**/*.{js,ts,jsx,tsx}",
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}"
  ],
  theme: {
    extend: {
      colors: palette
    }
  },
  plugins: []
};

import getPalette from "tailwindcss-palette-generator";

const palette = getPalette(params);

const palette = getPalette([
  {
    color: "rgb(255, 189, 0)", // required
    name: "primary", // required
    shade: 400
  },
  {
    color: "rgba(255, 189, 0, 1)", // required
    name: "secondary", // required
    shade: 500
  },
  {
    color: "hsl(44, 100%, 50%)", // required
    name: "tertiary", // required
    shade: 600
  },
  {
    color: "#FFBD00", // required
    name: "quaternary", // required
    shade: 300, // you will set shades is mandatory
    shades: [100, 200, 300, 400, 500]
  }
]);

const objectPalette = getPalette({
  color: "#FFBD00", // required
  name: "primary", // required
  shade: 300, // you will set shaders is mandatory
  shades: [100, 200, 300, 400, 500]
});

const stringPalette = getPalette("#FFBD00");