Emotion is a performant and flexible CSS-in-JS library. It's inspired by many other CSS-in-JS libraries like glam, glamor, styled-components and glamorous.
Emotion is a performant and flexible CSS-in-JS library. It's inspired by many other CSS-in-JS libraries like glam, glamor, styled-components and glamorous. It allows you to style applications quickly with string styles or object styles. It has predictable composition to avoid specificity issues with CSS. With source maps and labels, Emotion has a great developer experience and great performance with heavy caching and insertRule in production.
Example
import { css } from 'emotion'
render(
<div
className={css`
color: hotpink;
`}
>
Some text.
</div>
)
Resources
Packages
- emotion
- react-emotion
- babel-plugin-emotion
- emotion-server
- emotion-theming
- jest-emotion
- create-emotion
- create-emotion-styled
- create-emotion-server
- preact-emotion
