Не работает цвет при использовании компонента Text и

тоже не понимаю как стилизовать

import React, {FC, ReactNode} from "react";
import styles from "./styles/TextField.module.css";

export enum TextFieldTypes {
     h1 = "h1",
     h2 = "h2",
     h3 = "h3",
     h4 = "h4",
     p = "p",
}

export enum TextFieldTags {
     h1,h2,h3,h4,p
}

export enum TextColor {
     red= "#F53527",
     green = "#4F8325"
}

interface ITextFieldProps{
     children: ReactNode;
     // Tag: keyof typeof TextFieldTags;
     type: keyof typeof TextFieldTypes;
     color: keyof typeof TextColor;
}

const TextField: FC<ITextFieldProps> = ({type, children}) => {
     return (
          <p className={styles[type]}>{children}</p>
     );
};
export default TextField;

Использование Text <TextField type={"h1"} color={"green"} >База из 100 шаблонов от наших специалистов