我正在尝试这样做:
import { extendTheme } from "@chakra-ui/react";
import Fonts from "./Fonts";
const theme = extendTheme({
fonts: {
logo: "Satisfy",
},
colors: {
main: {
500: "red.500",
},
},
});
但是当这样使用它时它不起作用(main.500 无法识别):
function Logo() {
return (
<Center as={(props) => <Link {...props} to="/" />} h="full" p="10">
<Heading
fontFamily="logo"
as="h1"
fontSize="4xl"
fontWeight="bold"
color="main.500"
>
My Recipes
</Heading>
</Center>
);
}
什么是正确的方法?谢谢。