'Taiwlind bg-transparent not coming through

I have the following select:

  <select
    onChange={(e) => handleOnChange(e.target.value)}
    className="block appearance-none bg-transparent pr-5 pl-2 text-base font-bold md:hidden md:pl-0"
  >
    {options.map((option) => (
      <option value={option} key={option}>
        {option}
      </option>
    ))}
  </select>

however the only property that is not being applied is the bg-transparent and I can't figure out why

enter image description here

csstailwind-css


Solution 1:[1]

I had to create a custom config option like so:

module.exports = {
  mode: "jit",
  purge: ["./src/**/*.{tsx,ts}"],
  darkMode: false,
  theme: {
    colors: {
      transparent: {
        0: "transparent"
      }
...

in order to use it with appearance-none

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Aessandro

Related Questions