{"id":13550675,"url":"https://github.com/streamich/freestyler","last_synced_at":"2025-08-12T08:06:36.393Z","repository":{"id":37850440,"uuid":"106126978","full_name":"streamich/freestyler","owner":"streamich","description":"5th generation CSS-in-JS library","archived":false,"fork":false,"pushed_at":"2025-08-08T20:44:27.000Z","size":11350,"stargazers_count":272,"open_issues_count":13,"forks_count":10,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-08-08T22:26:50.564Z","etag":null,"topics":["css","css-in-js","css-in-react","react"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/freestyler","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/streamich.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2017-10-07T20:05:25.000Z","updated_at":"2025-08-08T20:44:14.000Z","dependencies_parsed_at":"2024-03-10T04:28:29.467Z","dependency_job_id":"3733b9d2-79b2-48d7-8bc9-eb20e6c129e5","html_url":"https://github.com/streamich/freestyler","commit_stats":{"total_commits":2022,"total_committers":7,"mean_commits":"288.85714285714283","dds":0.4000989119683481,"last_synced_commit":"1b4f23723b68342d0a6791b3effd81d6570faf77"},"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"purl":"pkg:github/streamich/freestyler","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Ffreestyler","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Ffreestyler/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Ffreestyler/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Ffreestyler/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/streamich","download_url":"https://codeload.github.com/streamich/freestyler/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/streamich%2Ffreestyler/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269668051,"owners_count":24456490,"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","status":"online","status_checked_at":"2025-08-10T02:00:08.965Z","response_time":71,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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","react"],"created_at":"2024-08-01T12:01:36.047Z","updated_at":"2025-08-12T08:06:36.339Z","avatar_url":"https://github.com/streamich.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"\u003e Consider using [`nano-css`](https://github.com/streamich/nano-css) instead. It is smaller, tested and actively maintained.\n\n![libreact logo](./docs/assets/freestyler.png)\n\n# freestyler\n\n[![][npm-badge]][npm-url] [![][travis-badge]][travis-url]\n\n[**5\u003csup\u003eth\u003c/sup\u003e generation**](./docs/en/generations.md) [React styling library][npm-url] \u0026mdash;\nit is *lightning fast*, *lean*, and with *gazillion* [__*feat*ures__](#feat).\n\n```\n        Yeah, straight from the top of my dome\n            As I rock, rock, rock, rock, rock the microphone\n                Yeah, straight from the top of my dome\n                    As I rock, rock, rock, rock, rock the microphone...\n```\n\n- Bomfunk MC's \u0026mdash; [Freestyler](https://www.youtube.com/watch?v=ymNFyxvIdaM)\n\n\n## feat.\n\n- *[fifth generation](./docs/en/feat/fifth-generation.md)*, *[lightweight](./docs/en/feat/lightweight.md)*, *[lightning fast](./docs/en/feat/fast.md)*, *[JIT CSS](./docs/en/feat/jit-css.md)*, *[code splitting](./docs/en/feat/code-splitting.md)*, *[dead code elimination](./docs/en/feat/dead-code-elimination.md)*, *[JavaScript variables](./docs/en/feat/variables.md)*\n\n![Typing and autocompletion](./docs/assets/typing.gif)\n\n## CSS Templates\n\n- [__Scoped__ styles without selectors](./docs/en/feat/scoped.md)\n- [__Nested__ selectors](./docs/en/feat/nesting.md)\n- __[Mixins](./docs/en/feat/mixins.md)__\n- __[Atoms](./docs/en/feat/atoms.md)__\n- [__Media queries__, keyframes, ...](./docs/en/feat/media.md)\n- [__Global__ styles](./docs/en/feat/global.md)\n- Global [entry and exit animations](./docs/en/animation.md)\n- [CSS __resets__](./docs/en/feat/resets.md)\n- __[Theming](./docs/en/feat/theming.md)__\n\n\n## Reference\n\n- [Terminology](./docs/en/terminology.md)\n- [Generations](./docs/en/generations.md)\n- [Interfaces](./docs/en/interfaces.md)\n- __Generic__ [Low-level API](./docs/en/low-level-api.md)\n- __Generic__ [__3\u003csup\u003erd\u003c/sup\u003e Generation Interfaces__](./docs/en/3rd-gen.md)\n    - [`rule()` Interface](./docs/en/rule.md)\n    - [`StyleSheet.create()` Interface](./docs/en/StyleSheet.md) with lazy rendering\n    - [`hyperstyle()` `styleName` Interface](./docs/en/hyperstyle.md)\n- __React.js__ [__4\u003csup\u003eth\u003c/sup\u003e Generation Interfaces__](./docs/en/4th-gen.md)\n    - [`styled()()` Component Interface](./docs/en/styled.md)\n    - [`@css` Static Class Decorator Interface](./docs/en/css-static-class-decorator.md)\n    - [`@css()` Class Decorator Interface](./docs/en/css-class-decorator.md)\n    - [`@css()` `.render()` Decorator Interface](./docs/en/css-render-decorator.md)\n    - [`Component` Class Interface](./docs/en/component-class.md)\n    - [`hoc()()` Higher Order Component Interface](./docs/en/hoc-generator.md)\n- __React.js__ [__5\u003csup\u003eth\u003c/sup\u003e Generation Interfaces__](./docs/en/5th-gen.md)\n    - [`styleit()` and `\u003cStyleit\u003e` Interfaces](./docs/en/styleit.md)\n    - [`jsxstyle()`, `\u003cBlock\u003e`, `\u003cInline\u003e`, `\u003cInlineBlock\u003e`, `\u003cRow\u003e`, and `\u003cColumn\u003e` Interfaces](./docs/en/jsxstyle.md)\n- [Environment Variables](./docs/en/env-vars.md)\n- [Server-side Rendering](./docs/en/ssr.md)\n- [How it Works?](./docs/en/how-it-works.md)\n\n\n## Installation\n\n\u003cpre\u003e\nnpm i \u003ca href=\"https://www.npmjs.com/package/freestyler\"\u003efreestyler\u003c/a\u003e --save\n\u003c/pre\u003e\n\n\n## Usage\n\n```js\nimport {\n    css,\n    styled,\n    rule,\n    StyleSheet,\n    Component,\n    hoc,\n    jsxstyle\n} from 'freestyler';\n\nimport hyperstyle from 'freestyler/lib/react/hyperstyle';\nimport {styleit, Styleit} from 'freestyler/lib/react/styleit';\n```\n\nDecorate *stateful* components.\n\n```jsx\n@css({\n    border: '1px solid tomato',\n})\nclass App extends Component {\n    render () {\n        return \u003cdiv\u003eHello world!\u003c/div\u003e;\n    }\n}\n```\n\nOr, create *\"styled\" stateless* components.\n\n```jsx\nconst Bordered = styled.div({\n    border: '1px solid tomato',\n});\nconst App = () =\u003e\n    \u003cBordered\u003eHello world!\u003c/Bordered\u003e;\n```\n\n\n## License\n\n[Unlicense](./docs/en/LICENSE.md) \u0026mdash; public domain.\n\n\n-------\n\n\u003cdiv style=\"text-align:center\"\u003e\u003ccenter\u003e\u003ci\u003eAre you a freestyler?\u003c/i\u003e\u003c/center\u003e\u003c/div\u003e\n\n\n[npm-url]: https://www.npmjs.com/package/freestyler\n[npm-badge]: https://img.shields.io/npm/v/freestyler.svg\n[travis-url]: https://travis-ci.org/streamich/freestyler\n[travis-badge]: https://travis-ci.org/streamich/freestyler.svg?branch=master\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstreamich%2Ffreestyler","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstreamich%2Ffreestyler","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstreamich%2Ffreestyler/lists"}