Skip to content

Instantly share code, notes, and snippets.

@RohitM-IN
Last active June 8, 2023 13:40
Show Gist options
  • Save RohitM-IN/d6e4e170e7374a0cc024b2bfd8d3f1f1 to your computer and use it in GitHub Desktop.
Save RohitM-IN/d6e4e170e7374a0cc024b2bfd8d3f1f1 to your computer and use it in GitHub Desktop.
Tailwind Color Scheme
/** @type {import('tailwindcss').Config} */
const colors = require('tailwindcss/colors');
module.exports = {
content: [
'./pages/**/*.{js,ts,jsx,tsx,mdx}',
'./components/**/*.{js,ts,jsx,tsx,mdx}',
'./app/**/*.{js,ts,jsx,tsx,mdx}',
],
theme: {
extend: {
colors: {
primary: {
DEFAULT: colors.sky[500],
dark: colors.sky[800],
},
secondary: {
DEFAULT: colors.coolGray[500],
dark: colors.coolGray[800],
},
accent: {
DEFAULT: colors.rose[500],
dark: colors.rose[800],
},
success: {
DEFAULT: colors.green[500],
dark: colors.green[800],
},
warning: {
DEFAULT: colors.amber[500],
dark: colors.amber[800],
},
info: {
DEFAULT: colors.cyan[500],
dark: colors.cyan[800],
},
error: {
DEFAULT: colors.red[500],
dark: colors.red[800],
},
},
},
},
plugins: [],
}
module.exports = {
content: [
'./pages/**/*.{js,ts,jsx,tsx,mdx}',
'./components/**/*.{js,ts,jsx,tsx,mdx}',
'./app/**/*.{js,ts,jsx,tsx,mdx}',
],
theme: {
extend: {
colors: {
primary: {
DEFAULT: '#1976D2',
dark: '#0F4DA8',
},
secondary: {
DEFAULT: '#607D8B',
dark: '#34515E',
},
accent: {
DEFAULT: '#009688',
dark: '#00675B',
},
success: {
DEFAULT: '#388E3C',
dark: '#206625',
},
warning: {
DEFAULT: '#FFC107',
dark: '#D39E00',
},
info: {
DEFAULT: '#03A9F4',
dark: '#0276AA',
},
error: {
DEFAULT: '#E53935',
dark: '#A61F23',
},
},
},
},
plugins: [],
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment