All colors gone after adding custom color in tailwind [duplicate]

128
January 22, 2022, at 04:10 AM
This question already has answers here:
Some classes have no effect after adding Tailwind.css to a Vue.js project (4 answers)
In Tailwind's config, what is the difference between adding properties to theme VS theme.extend? (1 answer)
Closed yesterday.

I just added a custom color to tailwind like this:

colors: {
         'slate': '#475569'
      },

Then I ran npm run watch and the color worked as expected, but all other colors are gone, they are wiped from the project and I can t use them because they don t show up in auto completion, nor do they work when typing them out myself.

Edit: When I delete the custom color and rerun npm run watch the old colors work again, but I need to add a custom one :/

Answer 1

i suspect you replace the default colors with the colors you add. in order to extend the default colors the tailwind.config.js file should look like this

module.exports = {
  theme: {
    extend: {
      colors: {
        brown: {
          50: '#fdf8f6',
        },
      }
    },
  },
}

if you place the colors key out of the extend key then the default colors will be removed.

Rent Charter Buses Company
READ ALSO
IOS responsiveness

IOS responsiveness

I have a header and footer script here but when I scroll back up on IOS there is the scroll bouncing and it records last scroll as a down scroll and hides my header ( important to be shown at top = 0)

134
android app using html and javascript ajax

android app using html and javascript ajax

I create Simple android app using html,css,javascript & webviewUsing Ajax, I process the data from the asp

40
How to randomly extract column from the data of an excel file with specifically setting a condition in Python

How to randomly extract column from the data of an excel file with specifically setting a condition in Python

I'm trying to randomly extract some data from my excel file through colab (Python)

131