布局

NextUI 的插件提供了多种布局自定义选项。更改间距单位、字体大小、行高、圆角等,以个性化每个主题。

使用布局令牌,您可以确保所有组件的整体美观一致,而无需覆盖默认的 Tailwind CSS 配置。

布局选项应用于所有组件。

默认布局

布局令牌的默认值是

CSS 变量

NextUI 使用 --prefix-prop-name-scale 格式为每个布局令牌创建 CSS 变量。默认情况下,前缀为 nextui,但您可以使用 prefix 选项更改它。

然后您可以在 CSS 文件中使用 CSS 变量。

API 参考

属性类型描述
hoverOpacity字符串,数字当组件被悬停时,作为 opacity-[value] 应用的 0 到 1 之间的数字。
disabledOpacity字符串,数字当组件被禁用时,作为 opacity-[value] 应用的 0 到 1 之间的数字。
dividerWeight字符串应用于分隔符组件的默认高度。我们建议使用 px 单位。
fontSizeFontThemeUnit应用于组件的默认字体大小。
lineHeightFontThemeUnit应用于组件的默认行高。
radiusBaseThemeUnit应用于组件的默认圆角。我们建议使用 rem 单位。
borderWidthBaseThemeUnit应用于组件的边框宽度。
boxShadowBaseThemeUnit应用于组件的阴影。

BaseThemeUnit

FontThemeUnit