样式系统
样式
所有组件都可以通过属性（props）进行样式设计。
概念
安装 Chakra UI 之后，请按照以下指南了解核心概念：
Chakra Factory
使用 chakra() 工厂函数创建可样式化的组件。
响应式设计
基于断点编写适配不同屏幕尺寸的样式。
CSS 变量
了解样式系统底层如何生成 CSS 变量。
暗色模式
开箱即用地在明暗色之间切换主题。
颜色透明度修饰符
使用 _alpha 与 _o 修饰符调整颜色透明度。
条件样式
通过条件前缀（如 _hover）编写状态相关样式。
虚拟颜色
自动在明暗色模式下切换的虚拟颜色令牌。
组合样式（Compositions）
在理解概念之后，学习如何使用这些组合式样，以避免重复书写样式：
文本样式
将排版样式组合成可复用的文本样式
层叠样式
将背景、边框等样式组合成层叠样式
动画样式
将动画组合成样式化的动画目标
焦点环
为键盘导航提供一致的焦点可见性
样式属性
样式属性是 Chakra UI 中最基础的样式设计方式。它们本质上是把 CSS 样式以属性的形式传给组件。 了解更多样式属性。