Back to rankings
A utility-first CSS-in-JS framework built for React. 💅👩🎤⚡️
styled-componentsemotioncssreactcss-in-jsstyled-systemtailwindcss
Key Metrics
Star Growth
Stars
2.3k
Forks
103
Weekly Growth
—
Issues
16
1k1.5k2k
May 2019Jul 2020Sep 2021Dec 2022Feb 2024May 2025Jul 2026
README
A utility-first CSS-in-JS framework built for React.
npm install @xstyled/styled-components styled-components
Docs
See the documentation at xstyled.dev for more information about using xstyled!
Quicklinks to some of the most-visited pages:
Example
import { x } from '@xstyled/styled-components'
function Example() {
return (
<x.div p={{ _: 3, md: 6 }} bg="white" display="flex" spaceX={4}>
<x.div flexShrink={0}>
<x.img h={12} w={12} src="/img/logo.svg" alt="xstyled Logo" />
</x.div>
<x.div>
<x.h4
fontSize={{ _: 'md', lg: 'xl' }}
fontWeight="medium"
color="black"
>
xstyled
</x.h4>
<x.p color="gray-500">A CSS-in-JS framework built for React.</x.p>
</x.div>
</x.div>
)
}
License
Licensed under the MIT License, Copyright © 2019-present Greg Bergé.
See LICENSE for more information.
Related repositories