Gradient as color

[LeonWehrhahn]

Is it possible to add gradients as a color?

{
        light: {
          ...require("daisyui/src/colors/themes")["[data-theme=light]"],
          info: "#bfdbfe",
          '--accent-2': '#eff6ff',
          '--accent-gradient': "linear-gradient(to right bottom, rgba(43, 108, 176, 0.9), rgba(43, 108, 176, 0.9))",
        },
        dark: {
          ...require("daisyui/src/colors/themes")["[data-theme=dark]"],
          info: "#3b82f6",
          '--accent-2': '#2a303c',
          '--accent-gradient': `[linear-gradient(180deg,_#eff6ff_50%,_#ffffff_50%)]`
        }
      }, "retro", "cyberpunk"],

[saadeghi]

No, because a color name in Tailwind CSS is being used in many utility classes. Not just backgrounds.
Color names are generated for text colors, border colors, etc... and many places where it just can't be a gradient. Not the way we use gradient on backgrounds.

[LeonWehrhahn]

Is there a way to specify different linear gradients for different themes in the tailwind.config.js, that then can be accessed for backgrounds of certain elements?

[saadeghi]

Yes.
You can have any style for a specific theme like this:
https://play.tailwindcss.com/3EQAvsxAAk?file=config

module.exports = {
  plugins: [
    require('daisyui'),
  ],
  daisyui: {
    themes: [
      {
        light: {
          ...require("daisyui/src/colors/themes")["[data-theme=light]"], //extend the built-in light theme to add more styles
          ".bg-my-gradient": {
            "background": "linear-gradient(to right bottom, pink, hotpink)"
          }
        },
      },
      {
        dark: {
          ...require("daisyui/src/colors/themes")["[data-theme=dark]"], //extend the built-in dark theme to add more styles
          ".bg-my-gradient": {
            "background": "linear-gradient(to right bottom, skyblue, teal)"
          }
        },
      },
    ],
  },
}

[LeonWehrhahn]

Great. Thanks you!!