{"id":27404465,"url":"https://github.com/censkh/style-composer","last_synced_at":"2026-04-05T23:33:28.784Z","repository":{"id":38893047,"uuid":"262934760","full_name":"Censkh/style-composer","owner":"Censkh","description":"Straightforward cross platform styling for React Native and the web","archived":false,"fork":false,"pushed_at":"2023-01-26T19:59:22.000Z","size":3883,"stargazers_count":1,"open_issues_count":19,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-13T23:04:16.027Z","etag":null,"topics":["javascript","react","react-native","styling","styling-css-in-js","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Censkh.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-05-11T04:05:15.000Z","updated_at":"2021-08-17T21:52:35.000Z","dependencies_parsed_at":"2023-02-17T15:35:21.514Z","dependency_job_id":null,"html_url":"https://github.com/Censkh/style-composer","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Censkh%2Fstyle-composer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Censkh%2Fstyle-composer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Censkh%2Fstyle-composer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Censkh%2Fstyle-composer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Censkh","download_url":"https://codeload.github.com/Censkh/style-composer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248826374,"owners_count":21167677,"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":["javascript","react","react-native","styling","styling-css-in-js","typescript"],"created_at":"2025-04-14T05:29:41.679Z","updated_at":"2025-12-30T23:05:06.021Z","avatar_url":"https://github.com/Censkh.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# [style-composer](https://github.com/Censkh/style-composer/) \u0026middot; [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/Censkh/style-composer/blob/master/LICENSE) [![npm version](https://img.shields.io/npm/v/style-composer.svg?style=flat)](https://www.npmjs.com/package/style-composer)\n\nStraightforward and powerful cross platform styling for React Native supporting Android, iOS and web\n\n``` npm i style-composer ```\n\n**Note:** this package is in early development, use with caution\n\n- [Documentation](https://censkh.github.io/style-composer)\n\n```tsx\nimport {StyledView, StyledText, composeClass, media} from \"style-composer\";\n\nconst $Card = composeClass(\"card\", () =\u003e ({\n  padding: 10,\n  fontSize: 12,\n\n  [media({minWidth: 500})]: {\n      fontSize: 14,\n  }\n}));\n\n\u003cStyledView classes={$Card}\u003e\n  \u003cStyledText\u003eIt just works!\u003c/StyledText\u003e\n\u003c/StyledView\u003e\n```\n\n## Features\n\n- [Cascading Styles](https://censkh.github.io/style-composer/cascading)\n- Native \u0026 Web Support\n- [`!important` like feature](https://censkh.github.io/style-composer/rule-order-and-important)\n- [Media Queries](https://censkh.github.io/style-composer/style-selectors)\n- [Class Variants](https://censkh.github.io/style-composer/variants)\n- [Theming](https://censkh.github.io/style-composer/theming)\n- [Dynamic Units (vw, vh)](https://censkh.github.io/style-composer/dynamic-units)\n\n## Why?\n\nThe inbuilt styling system for React Native isn't powerful enough to allow for universal styling without the need to add component level logic to adapt to platform or screen size changes.\n\nFor example, currently with RN's inbuilt StyleSheets it is not possible to have media queries or themes without component logic.\n\nTo solve this `style-composer` builds on-top of this system to provide many features it can't.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcenskh%2Fstyle-composer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcenskh%2Fstyle-composer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcenskh%2Fstyle-composer/lists"}