样式组件、样式系统、情感和主题 UI？

【问题标题】：Styled-components, Styled-system, emotion and theme-ui?样式组件、样式系统、情感和主题 UI？
【发布时间】：2021-07-07 21:10:36
【问题描述】：

有人可以解释Styled-components, Styled-system, emotion and theme-ui 之间的区别吗？此外，这些库如何适应 MDX 环境？

注意：我浏览了所有文档，但无法找出差异

【问题讨论】：

标签： styled-components emotion css-in-js theme-ui styled-system

【解决方案1】：

Styled-System 是 Styled-Components（或 Emotion，由您决定）的超集。它旨在用于使您的主题更整洁，并增加各种生活质量改进，例如内联速记道具。 Theme-ui 建立在此之上，进一步抽象并为您提供开箱即用的基本原语。通常，如果您使用 styled-system，您将开始创建许多实用功能和组件，并且它会开始类似于 Theme-ui。所以它作为你的解决方案而存在。

Styled-Components/Emotion
    Styled-System
        Theme-ui/Rebass

【讨论】：