{"meta":{"name":"FindSoftware","page":"https://findsoftware.frbit.cloud/emotion/","markdown":"https://findsoftware.frbit.cloud/emotion.md","license":"https://creativecommons.org/licenses/by/4.0/","attribution":"FindSoftware, CC BY 4.0","note":"Attributes are recorded, never scored. An absent field means unknown, never zero and never bad."},"record":{"id":"emotion","name":"Emotion","urls":{"home":"https://emotion.sh/","repository":"https://github.com/emotion-js/emotion","docs":"https://emotion.sh/docs/introduction"},"category":["css-framework"],"description":"CSS-in-JS library for writing styles with JavaScript, with packages for React and for other frameworks.","maintainer":"Emotion team","maintainerType":"community","firstRelease":2017,"hosting":null,"language":"javascript","runtimeMin":null,"contentStore":null,"databases":null,"adminUi":null,"headlessApi":null,"templating":null,"i18n":null,"renderingModes":null,"installMethod":"npm","licenseModel":"open-source","license":"MIT","currentMajor":"11","latestReleaseDate":"2024-12-09T00:00:00.000Z","githubStargazers":18023,"contributors":304,"packagistDownloads":null,"npmWeeklyDownloads":24906382,"httpArchiveSites":163632,"dependentRepos":273331,"dependentPackages":12586,"checkedAt":"2026-10-26T00:00:00.000Z","addedAt":"2026-10-26T00:00:00.000Z","sources":[{"field":"urls","url":"https://emotion.sh/docs/introduction","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"urls","url":"https://github.com/emotion-js/emotion","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"urls","url":"https://emotion.sh/docs/introduction","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"firstRelease","url":"https://github.com/emotion-js/emotion/releases/tag/v6.0.0","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"maintainer","url":"https://github.com/emotion-js/emotion/blob/main/LICENSE","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"maintainerType","url":"https://github.com/emotion-js/emotion/blob/main/LICENSE","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"language","url":"https://github.com/emotion-js/emotion","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"category","url":"https://emotion.sh/docs/introduction","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"installMethod","url":"https://emotion.sh/docs/install","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"installMethod","url":"https://emotion.sh/docs/install","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"installMethod","url":"https://emotion.sh/docs/introduction","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"license","url":"https://github.com/emotion-js/emotion","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"license","url":"https://github.com/emotion-js/emotion/blob/main/LICENSE","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"licenseModel","url":"https://github.com/emotion-js/emotion","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"currentMajor","url":"https://github.com/emotion-js/emotion/releases/tag/@emotion/react@11.14.0","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"latestReleaseDate","url":"https://github.com/emotion-js/emotion/releases/tag/@emotion/react@11.14.0","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"githubStargazers","url":"https://github.com/emotion-js/emotion","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"contributors","url":"https://github.com/emotion-js/emotion","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"npmWeeklyDownloads","url":"https://api.npmjs.org/downloads/range/2026-09-28:2026-10-04/@emotion/react","checkedAt":"2026-10-28T00:00:00.000Z"},{"field":"dependentPackages","url":"https://packages.ecosyste.ms/api/v1/registries/npmjs.org/packages/%40emotion%2Freact","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"dependentRepos","url":"https://packages.ecosyste.ms/api/v1/registries/npmjs.org/packages/%40emotion%2Freact","checkedAt":"2026-10-26T00:00:00.000Z"},{"field":"httpArchiveSites","url":"https://cdn.httparchive.org/v1/technologies","checkedAt":"2026-10-26T00:00:00.000Z"}],"status":"active","ai":"authored"},"prose":"Emotion is a CSS-in-JS library: styles are written in JavaScript, as strings or objects, and turned into class names. The introduction page describes two ways to use it. The @emotion/css package is framework agnostic and needs no additional setup, babel plugin or other configuration change. The @emotion/react package is for React and adds a css prop and theming, and @emotion/styled adds a styled API for React components.\n\n## Worth knowing\n\nThe React package requires React, so it cannot be used without it. Server-side rendering with the framework-agnostic package needs additional work to set up, while the React package renders on the server with zero configuration, according to the introduction page."}