chakra - 是否可以修改 Chakra UI 的 rem 大小？

Question

标题差不多。已在文档上搜索有关如何执行此操作的说明，但没有运气。

我的设置是使用 NextJS 并且 resetCSS 是通过 ChakraProvider 传递的，所以我无法更改样式来修改字体大小，因为 Chakra 会覆盖它。

Answer 1

我也曾在 reddit 上寻求帮助，有人指导我阅读这部分文档，让我解决这个问题。

所以，在 _app.js 我有扩展主题的主题常量。刚刚添加

styles: { 
  global: { 
      html: { 
          fontSize: "18px"
      }
   }
}

Answer 2

是的，这是可能的。例如，我想让 sm 字体大小更大：

import { extendTheme } from "@chakra-ui/react"

const theme = extendTheme({
  ...
  fontSizes: {
    sm: "1.4rem",
  },
  ...
})