To add the below code with diffrent linear gradient in side tailwind.config.js
backgroundImage: (theme) => ({
'blueshadehome': 'linear-gradient(180deg, rgba(99, 171, 163, 0.75) 0%, #8099F3 95.17%)',
'orangeshadehome': 'linear-gradient(180deg, #FF9900 0%, rgba(255, 168, 0, 0.63) 100%)',
'pinkshadehome': 'linear-gradient(180deg, #DC5988 0%, rgba(212, 53, 168, 0.66) 100%)',
'greenshadehome': 'linear-gradient(180deg, rgba(36, 118, 99, 0.9) 0%, rgba(153, 215, 155, 0.9) 31.17%)',
'violetshadehome': 'linear-gradient(180deg, #58608B 0%, #CAD0F2 100%)',
'oliveshadehome': 'linear-gradient(180deg, #70800F 0%, #CDD5A2 100%)',
}),
in below format
module.exports = {
purge: ['./src/**/*.{js,jsx,ts,tsx}', './public/index.html'],
darkMode: false, // or 'media' or 'class'
theme: {
extend: {
backgroundImage: (theme) => ({
'blueshadehome': 'linear-gradient(180deg, rgba(99, 171, 163, 0.75) 0%, #8099F3 95.17%)',
'orangeshadehome': 'linear-gradient(180deg, #FF9900 0%, rgba(255, 168, 0, 0.63) 100%)',
'pinkshadehome': 'linear-gradient(180deg, #DC5988 0%, rgba(212, 53, 168, 0.66) 100%)',
'greenshadehome': 'linear-gradient(180deg, rgba(36, 118, 99, 0.9) 0%, rgba(153, 215, 155, 0.9) 31.17%)',
'violetshadehome': 'linear-gradient(180deg, #58608B 0%, #CAD0F2 100%)',
'oliveshadehome': 'linear-gradient(180deg, #70800F 0%, #CDD5A2 100%)',
}),
},
},
variants: {
extend: {},
},
plugins: [
require("tailwindcss"),
require("autoprefixer")
],
}