I have a React JS web app. I have a custom theme, all components change color but not TextArea. When I watch inspector, TextAra use “–nextui-default-100: 240 3.7% 15.88%;” but I tried to define it to tailwind.config.js but still not working.
How to change backgroundcolor of TextArea with NextUI ?
const { nextui } = require("@nextui-org/react");
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./src/**/*.{js,ts,jsx,tsx}",
"./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
darkMode: "class", // or 'media'
plugins: [
nextui({
themes: {
"blue-gray-dark": {
extend: "dark",
colors: {
"nextui-default-100": "#4299e1",
background: "#1A202C", // Teinte gris foncé
foreground: "#E2E8F0", // Gris clair pour le texte
primary: {
50: "#2a4365", // Bleu foncé pour les nuances légères
100: "#2c5282",
200: "#2b6cb0",
300: "#3182ce",
400: "#4299e1",
500: "#63b3ed", // Bleu principal
600: "#4299e1",
700: "#3182ce",
800: "#2b6cb0",
900: "#2c5282",
DEFAULT: "#2b6cb0",
foreground: "#E2E8F0", // Gris clair pour le texte sur fond bleu
},
focus: "#3182ce", // Bleu plus vif pour les éléments en focus
},
layout: {
disabledOpacity: "0.3",
radius: {
small: "4px",
medium: "6px",
large: "8px",
},
borderWidth: {
small: "1px",
medium: "2px",
large: "3x",
},
},
},
},
}),
],
};