{"id":13394089,"url":"https://github.com/streamich/nano-css","last_synced_at":"2025-05-14T00:08:23.256Z","repository":{"id":30442545,"uuid":"124937295","full_name":"streamich/nano-css","owner":"streamich","description":"Distilled CSS-in-JS for gourmet developers","archived":false,"fork":false,"pushed_at":"2025-05-11T08:55:43.000Z","size":3308,"stargazers_count":439,"open_issues_count":31,"forks_count":25,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-05-12T23:36:45.212Z","etag":null,"topics":["css","css-in-js","css-in-react","cssom","emotion","js","nano","styled-components","styles","stylesheets","ts"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"unlicense","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/streamich.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"streamich"}},"created_at":"2018-03-12T19:02:05.000Z","updated_at":"2025-05-11T08:54:38.000Z","dependencies_parsed_at":"2023-12-06T20:44:33.171Z","dependency_job_id":"1500025f-b0ae-4ac5-8d3f-9bf9824545e2","html_url":"https://github.com/streamich/nano-css","commit_stats":{"total_commits":533,"total_committers":19,"mean_commits":28.05263157894737,"dds":"0.33958724202626644","last_synced_commit":"bd39f2effac547509046d14524e07fef479b847a"},"previous_names":["streamich/pico-style"],"tags_count":30,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Fnano-css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Fnano-css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Fnano-css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Fnano-css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/streamich","download_url":"https://codeload.github.com/streamich/nano-css/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254043996,"owners_count":22005054,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","css-in-js","css-in-react","cssom","emotion","js","nano","styled-components","styles","stylesheets","ts"],"created_at":"2024-07-30T17:01:08.583Z","updated_at":"2025-05-14T00:08:23.221Z","avatar_url":"https://github.com/streamich.png","language":"JavaScript","readme":"# nano-css\n\n[![][npm-badge]][npm-url] [![][travis-badge]][travis-url]\n\n__Tiny [5\u003csup\u003eth\u003c/sup\u003e generation](https://github.com/streamich/freestyler/blob/master/docs/en/generations.md#5th-generation) CSS-in-JS library__ that you can actually use in production.\n__Motto of `nano-css` is simple__: *create the smallest possible CSS-in-JS library and provide all features of any other library through addons.*\n\n- __Only [0.5 Kb](https://bundlephobia.com/result?p=nano-css@1.15.3)__ in base configuration, *e.g. [`styled-components`](https://github.com/styled-components/styled-components) is [15.1Kb](https://bundlephobia.com/result?p=styled-components@3.2.5)*\n- __Library-agnostic__ \u0026mdash; use it standalone, with React, Preact, Vue.js, or any other library\n- __Isomorphic__ \u0026mdash; render on server and browser, generates stable class names, and re-hydrates\n- __Performant__ \u0026mdash; [*simply the fastest library*](https://github.com/streamich/CSS-IN-JS-Benchmarks/blob/master/RESULT.md); does not create wrapper components, does not use inline styles or inline `\u003cstyle\u003e` elements, but caches all styles for re-use and injects CSS using `.insertRule()` for performance\n- __`@media` queries__ and __animation `@keyframes`__ are supported\n- __Auto-prefixes__ your styles\n- __Extract CSS__ into external style sheet\n- __Public domain__ \u0026mdash; [Unlicense license](./LICENSE)\n\n\u003e For pre-configured simple-to-use package see [`nano-theme`](https://github.com/streamich/nano-theme), which builds on top of `nano-css`.\n\n\n## Reference\n\n- [Installation](./docs/Installation.md)\n- [Addons](./docs/Addons.md)\n  - [`put()`](./docs/put.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/nkovxrzyv4)\n  - [`rule()`](./docs/rule.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/oxlj92m1m9)\n  - [`drule()`](./docs/drule.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/9jq5zmm91p)\n  - [`sheet()`](./docs/sheet.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/wyw093m7kw)\n  - [`dsheet()`](./docs/dsheet.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/q7rx4981vq)\n  - [`jsx()`](./docs/jsx.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/5y63x88504)\n  - [`useStyles()`](./docs/useStyles.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/o5k9jjo306)\n  - [`withStyles()`](./docs/withStyles.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/5k3jvkk31l)\n  - [`decorator`](./docs/decorator.md) \u0026mdash; [*demo № 1*](https://codesandbox.io/s/j442958125) and [*demo № 2*](https://codesandbox.io/s/3qjzv35941)\n  - [`component`](./docs/component.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/yk8pk4v95j)\n  - [`style()`](./docs/style.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/53qk3qkopn)\n  - [`styled()()`](./docs/styled.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/w667y036p5)\n  - [`hyperstyle()`](./docs/hyperstyle.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/wqny7z17x8)\n  - [`stable`](./docs/stable.md)\n  - [`atoms`](./docs/atoms.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/rlkxl6o9v4)\n  - [`emmet`](./docs/emmet.md)\n  - [`nesting`](./docs/nesting.md)\n  - [`keyframes()`](./docs/keyframes.md)\n  - [`hydrate()`](./docs/hydrate.md)\n  - [`prefixer`](./docs/prefixer.md)\n  - [`stylis`](./docs/stylis.md)\n  - [`unitless`](./docs/unitless.md)\n  - [`!important`](./docs/important.md)\n  - [`:global`](./docs/global.md)\n  - [`animate/*`](./docs/animations.md)\n  - [`reset/*`](./docs/resets.md)\n  - [`reset-font`](./docs/reset-font.md)\n  - [`googleFont()`](./docs/googleFont.md)\n  - [`limit`](./docs/limit.md)\n  - [`amp`](./docs/amp.md)\n  - [`virtual`](./docs/virtual.md)\n  - [`spread`](./docs/spread.md)\n  - [`array`](./docs/array.md)\n  - [`snake`](./docs/snake.md) \u0026mdash; [*demo!*](https://codesandbox.io/s/mo7n1857zj)\n  - [`tachyons`](./docs/tachyons.md)\n  - [`rtl`](./docs/rtl.md)\n  - [`extract`](./docs/extract.md)\n  - [`sourcemaps`](./docs/sourcemaps.md)\n  - [`.units`](./docs/units.md)\n  - [`cssom`](./docs/cssom.md)\n  - [`vcssom`](./docs/vcssom.md)\n- [Presets](./docs/Presets.md)\n- [Server-side rendering](./docs/SSR.md)\n\n\n[npm-url]: https://www.npmjs.com/package/nano-css\n[npm-badge]: https://img.shields.io/npm/v/nano-css.svg\n[travis-url]: https://travis-ci.org/streamich/nano-css\n[travis-badge]: https://travis-ci.org/streamich/nano-css.svg?branch=master\n","funding_links":["https://github.com/sponsors/streamich"],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstreamich%2Fnano-css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstreamich%2Fnano-css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstreamich%2Fnano-css/lists"}