import { DefaultTheme } from "styled-components" ; export interface ITheme { colors : { primary : string ; accent : string ; white : string ; black : string ; gray : string ; gray1 : string ; darkGray : string ; } ; fontSize : { xs : string ; sm : string ; base : string ; lg : string ; xl : string ; "2xl" : string ; "3xl" : string ; "4xl" : string ; "5xl" : string ; "6xl" : string ; } ; spacing : { px : string ; 0 : string ; 1 : string ; 2 : string ; 3 : string ; 4 : string ; 5 : string ; 6 : string ; 8 : string ; 10 : string ; 12 : string ; 16 : string ; 20 : string ; 24 : string ; 32 : string ; 40 : string ; 48 : string ; 56 : string ; 64 : string ; } ; fontFamiy : string [ ] ; maxWidth : string ; outlineNone : string ; shadowOutline : string ; } const theme = { colors : { primary : "#212529" , accent : "#146eb4" , white : "#fff" , black : "#000" , gray : "#f2f2f2" , gray1 : "#fafafa" , darkGray : "#98989898" , } , fontSize : { xs : "0.75rem" , sm : "0.875rem" , base : "1rem" , lg : "1.125rem" , xl : "1.25rem" , "2xl" : "1.5rem" , "3xl" : "1.875rem" , "4xl" : "2.25rem" , "5xl" : "3rem" , "6xl" : "4rem" , } , spacing : { px : "1px" , 0 : "0" , 1 : "0.25rem" , 2 : "0.5rem" , 3 : "0.75rem" , 4 : "1rem" , 5 : "1.25rem" , 6 : "1.5rem" , 8 : "2rem" , 10 : "2.5rem" , 12 : "3rem" , 16 : "4rem" , 20 : "5rem" , 24 : "6rem" , 32 : "8rem" , 40 : "10rem" , 48 : "12rem" , 56 : "14rem" , 64 : "16rem" , } , fontFamiy : [ "Montserrat" ] , maxWidth : "71.25rem" , outlineNone : "0 0 0 1px transparent" , shadowOutline : "0 0 0 3px rgba(66, 153, 225, 0.5)" , } ; export default theme ;