🔮Theme Colors

Configure the colors of the theme in one place.

const PurpleTheme = {
  name: "PurpleTheme",
  dark: false,
  variables: {
    "border-color": "#1e88e5",
    "carousel-control-size": 10,
  },
  colors: {
    primary: "#1e88e5", 
    secondary: "#5e35b1",
    info: "#03c9d7",
    success: "#00c853",
    accent: "#FFAB91",
    warning: "#ffc107",
    error: "#f44336",
    lightprimary: "#e3f2fd",
    lightsecondary: "#ede7f6",
    lightsuccess: "#b9f6ca",
    lighterror: "#f9d8d8",
    lightwarning: "#fff8e1",
    darkText: "#212121",
    lightText: "#616161",
    darkprimary: "#1565c0",
    darksecondary: "#4527a0",
    borderLight: "#90caf9",
    inputBorder: "#787878",
    containerBg: "#e3f2fd",
    surface: "#fff",
    "on-surface-variant": "#fff",
    facebook: "#4267b2",
    twitter: "#1da1f2",
    linkedin: "#0e76a8",
    gray100: "#fafafa",
    primary200: "#90caf9",
    secondary200: "#b39ddb",
  },
};

Last updated