pierrelf.com
this repo has no description
1import { createTheme } from '@mui/material/styles';
2
3const theme = createTheme({
4 palette: {
5 mode: 'dark',
6 primary: {
7 main: '#E8453C',
8 light: '#EF6B63',
9 dark: '#C02E26',
10 contrastText: '#FFFFFF',
11 },
12 success: {
13 main: '#4CAF50',
14 light: '#66BB6A',
15 dark: '#388E3C',
16 },
17 secondary: {
18 main: '#CE82FF',
19 light: '#DDA0FF',
20 dark: '#A855E0',
21 contrastText: '#FFFFFF',
22 },
23 error: {
24 main: '#FF4B4B',
25 light: '#FF7070',
26 dark: '#CC3C3C',
27 },
28 warning: {
29 main: '#FFC800',
30 light: '#FFD633',
31 dark: '#CCA000',
32 },
33 background: {
34 default: '#131F24',
35 paper: '#1B2B32',
36 },
37 text: {
38 primary: '#FFFFFF',
39 secondary: '#AFAFAF',
40 },
41 },
42 typography: {
43 fontFamily: '"Nunito", sans-serif',
44 button: {
45 fontWeight: 700,
46 textTransform: 'uppercase',
47 letterSpacing: '0.05em',
48 },
49 h4: {
50 fontWeight: 700,
51 },
52 h5: {
53 fontWeight: 700,
54 },
55 h6: {
56 fontWeight: 700,
57 },
58 },
59 shape: {
60 borderRadius: 16,
61 },
62 components: {
63 MuiButton: {
64 styleOverrides: {
65 root: {
66 borderRadius: 16,
67 fontWeight: 700,
68 fontSize: '1rem',
69 padding: '12px 24px',
70 textTransform: 'uppercase',
71 boxShadow: '0 4px 0 rgba(0,0,0,0.3)',
72 transition: 'all 0.15s ease',
73 '&:active': {
74 boxShadow: '0 1px 0 rgba(0,0,0,0.3)',
75 transform: 'translateY(3px)',
76 },
77 },
78 containedPrimary: {
79 boxShadow: '0 4px 0 #C02E26',
80 '&:hover': {
81 backgroundColor: '#EF6B63',
82 boxShadow: '0 4px 0 #C02E26',
83 },
84 '&:active': {
85 boxShadow: '0 1px 0 #C02E26',
86 },
87 },
88 containedSecondary: {
89 boxShadow: '0 4px 0 #A855E0',
90 '&:hover': {
91 backgroundColor: '#DDA0FF',
92 boxShadow: '0 4px 0 #A855E0',
93 },
94 '&:active': {
95 boxShadow: '0 1px 0 #A855E0',
96 },
97 },
98 containedError: {
99 boxShadow: '0 4px 0 #CC3C3C',
100 '&:hover': {
101 backgroundColor: '#FF7070',
102 boxShadow: '0 4px 0 #CC3C3C',
103 },
104 '&:active': {
105 boxShadow: '0 1px 0 #CC3C3C',
106 },
107 },
108 },
109 },
110 MuiCard: {
111 styleOverrides: {
112 root: {
113 borderRadius: 16,
114 backgroundImage: 'none',
115 },
116 },
117 },
118 MuiTextField: {
119 styleOverrides: {
120 root: {
121 '& .MuiOutlinedInput-root': {
122 borderRadius: 12,
123 },
124 },
125 },
126 },
127 },
128});
129
130export default theme;