Question 393070 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – How can i change background linear gradient to tailwind in config.js to dark mode

I would like add in my tailwind.config.js linear gradient. This not is possible?

exemplo using

`theme: {
  extend: {
    colors: {
      darkGrad: {
        DEFAULT: 'linear-gradient(to bottom, #181381, #150B32, #000000, #5C2C85, #590544)',
      },
      // ... outras cores
    },
    // ... outras extensões
  },
},`

`<body class="bg-darkGrad">
  </body>
`

I think that the code not is working

`'linear-gradient(to bottom, #181381, #150B32, #000000, #5C2C85, #590544)',`
Tags:

2

Answers


  1. 0

    You can extend background images instead.

    console.clear();
    <script src="https://cdn.tailwindcss.com"></script>
<script>
  tailwind.config = {
    theme: {
      extend: {
        backgroundImage: {
          darkGrad: 'linear-gradient(to bottom, #181381, #150B32, #000000, #5C2C85, #590544)'
        }
      }
    }
  }
</script>
<body class="bg-darkGrad">
  Some text...
</body>
    Login or Signup to reply.
  2. 0

    try this

      theme: {
    colors: {
      "linear-1": "linear-gradient(180deg, #5C4C69 0%, #422758 100%)",

    furthermore for background images

       extend: {
      backgroundImage: {
        "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
        "gradient-conic":
          "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
      },
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search