Summary
Emotion is a library designed for writing css styles with JavaScript.
1
It supports both string and object styles.
1
Object styles are written in camelCase instead of kebab-case.
2
It also provides features such as source maps, labels, and testing utilities.
1
It is also available from @emotion/styled, which was heavily inspired by styled-components and glamorous.
3
According to
See more results on Neeva
Summaries from the best pages on the web
Summary
Emotion is a library designed for writing css styles with JavaScript. It provides powerful and predictable style composition in addition to a great developer experience with features such as source maps, labels, and testing utilities. Both string and object styles are supported.
Emotion – Introduction
emotion.sh
Summary
It's available from @emotion/styled . styled was heavily inspired by styled-components and glamorous .
styled is very similar to css except you call it with an html tag or React component and then call that with a template literal for string styles or a regular function call for object styles.
Emotion – Styled Components
emotion.sh
Summary
Writing styles with objects is a powerful pattern built directly into the core of emotion. Instead of writing css properties in kebab-case like regular css, you write them in camelCase , for example background-color would be backgroundColor .
Emotion – Object Styles
emotion.sh
The primary way to style elements with emotion is the css prop. It provides a concise and flexible API to style your components.
Emotion – The css Prop
emotion.sh
@emotion/css The @emotion/css package is framework agnostic and the simplest way to use Emotion.
Emotion – @emotion/css
emotion.sh
Composition is one of the most powerful and useful patterns in Emotion. You can compose styles together by interpolating value returned from css in another ...
Emotion – Composition
emotion.sh
