# @emotion/styled

> styled API for emotion

Latest version **11.14.1** (published 2025-06-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install @emotion/styled
pnpm add @emotion/styled
yarn add @emotion/styled
bun add @emotion/styled
```

## Health

**Score 55/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities; high maintenance score; popular repo.

Warnings: low downloads.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 11.14.1 |
| Published | 2025-06-26 |
| First published | 2018-02-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 6 |
| Unpacked size | 240.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 18020 |
| Maintainers | tkh44, emotion-release-bot, andarist, emmatown |

## Links

- npm: https://www.npmjs.com/package/@emotion/styled
- Repository: https://github.com/emotion-js/emotion.git#main
- Homepage: https://github.com/emotion-js/emotion/tree/main#readme
- Issues: https://github.com/emotion-js/emotion/issues
- npm.io page: https://npm.io/package/@emotion/styled

## Dependencies (6)

- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.18.3
- [@emotion/utils](https://npm.io/package/@emotion/utils.md) ^1.4.2
- [@emotion/serialize](https://npm.io/package/@emotion/serialize.md) ^1.3.3
- [@emotion/babel-plugin](https://npm.io/package/@emotion/babel-plugin.md) ^11.13.5
- [@emotion/is-prop-valid](https://npm.io/package/@emotion/is-prop-valid.md) ^1.3.0
- [@emotion/use-insertion-effect-with-fallbacks](https://npm.io/package/@emotion/use-insertion-effect-with-fallbacks.md) ^1.2.0

## Recent versions

- 11.14.1 (latest) — 2025-06-26
- 10.3.0 (ten) — 2021-11-26
- 11.0.0-rc.0 (rc) — 2020-10-11
- 11.0.0-next.19 (next) — 2020-10-03
- 10.0.0-really-unsafe-please-do-not-use.2 (really-unsafe-please-do-not-use) — 2018-09-28
- 11.14.0 — 2024-12-09
- 11.13.5 — 2024-11-20
- 11.13.0 — 2024-07-20
- 11.12.0 — 2024-07-19
- 11.11.5 — 2024-03-29
- 11.11.0 — 2023-05-06
- 11.10.8 — 2023-04-28
- 11.10.6 — 2023-02-16
- 11.10.5 — 2022-10-27
- 11.10.4 — 2022-08-30
- … 90 more at https://npm.io/package/@emotion/styled/versions

## README

# @emotion/styled

> The styled API for @emotion/react

## Install

```bash
yarn add @emotion/react @emotion/styled
```

## Usage

```jsx
import styled from '@emotion/styled'

let SomeComp = styled.div({
  color: 'hotpink'
})

let AnotherComp = styled.div`
  color: ${props => props.color};
`

render(
  <SomeComp>
    <AnotherComp color="green" />
  </SomeComp>
)
```

More documentation is available at [https://emotion.sh/docs/styled](https://emotion.sh/docs/styled).

---
_Source: https://npm.io/package/@emotion/styled · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
