{"id":13403009,"url":"https://github.com/tw-in-js/twind","last_synced_at":"2025-05-08T22:16:57.083Z","repository":{"id":37567420,"uuid":"318854398","full_name":"tw-in-js/twind","owner":"tw-in-js","description":"The smallest, fastest, most feature complete Tailwind-in-JS solution in existence.","archived":false,"fork":false,"pushed_at":"2025-05-06T04:10:15.000Z","size":48430,"stargazers_count":3864,"open_issues_count":18,"forks_count":105,"subscribers_count":16,"default_branch":"main","last_synced_at":"2025-05-07T18:07:19.237Z","etag":null,"topics":["css","css-in-js","tailwind","tailwind-in-js","tailwindcss"],"latest_commit_sha":null,"homepage":"https://twind.style","language":"JavaScript","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/tw-in-js.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":"ROADMAP.md","authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"tw-in-js","open_collective":"twind","ko_fi":"twind"}},"created_at":"2020-12-05T17:59:21.000Z","updated_at":"2025-05-07T11:57:14.000Z","dependencies_parsed_at":"2023-12-31T05:19:03.002Z","dependency_job_id":"3fc59ce5-1225-4827-89d5-cb88e9c33b41","html_url":"https://github.com/tw-in-js/twind","commit_stats":{"total_commits":740,"total_committers":20,"mean_commits":37.0,"dds":0.3094594594594594,"last_synced_commit":"2e7ed6f3ac7ab7bac481b1e8f1451c4d3c3d918d"},"previous_names":["tw-in-js/core"],"tags_count":198,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tw-in-js%2Ftwind","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tw-in-js%2Ftwind/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tw-in-js%2Ftwind/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tw-in-js%2Ftwind/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tw-in-js","download_url":"https://codeload.github.com/tw-in-js/twind/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252958422,"owners_count":21831661,"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","tailwind","tailwind-in-js","tailwindcss"],"created_at":"2024-07-30T19:01:24.179Z","updated_at":"2025-05-07T21:35:30.438Z","avatar_url":"https://github.com/tw-in-js.png","language":"JavaScript","readme":"\u003cdiv align=\"center\"\u003e\n\n\u003cimg src=\"https://twind.dev/assets/twind-logo-animated.svg\" height=\"125\" width=\"125\" /\u003e\n\u003ca href=\"https://twind.style\" align=\"center\"\u003e\u003ch1\u003eTwind\u003c/h1\u003e\u003c/a\u003e\n\n\u003cp align=\"center\"\u003e\nThe smallest, fastest, most feature complete Tailwind-in-JS solution in existence\n\u003c/p\u003e\n\n\u003c/div\u003e\n\n---\n\n[![MIT License](https://flat.badgen.net/github/license/tw-in-js/twind)](https://github.com/tw-in-js/twind/blob/main/LICENSE)\n[![Latest Release](https://flat.badgen.net/npm/v/@twind/core?icon=npm\u0026label\u0026cache=10800\u0026color=blue)](https://www.npmjs.com/package/@twind/core)\n[![Documentation](https://flat.badgen.net/badge/icon/Documentation?icon=awesome\u0026label)](https://twind.style)\n[![Github](https://flat.badgen.net/badge/icon/tw-in-js%2Ftwind?icon=github\u0026label)](https://github.com/tw-in-js/twind)\n[![Discord](https://img.shields.io/discord/798324011980423188?label=chat\u0026logo=discord)](https://chat.twind.style)\n[![CI](https://github.com/tw-in-js/twind/actions/workflows/ci.yml/badge.svg)](https://github.com/tw-in-js/twind/actions/workflows/ci.yml)\n[![Coverage Status](https://flat.badgen.net/coveralls/c/github/tw-in-js/twind?icon=codecov\u0026label\u0026cache=10800)](https://coveralls.io/github/tw-in-js/twind)\n\nTwind is a small compiler that converts utility classes into CSS at runtime. The goal of this project is to unify the flexibility of CSS-in-JS with the carefully considered constraints of the Tailwind API.\n\nUtility-first CSS without any build step right in the browser or any other environment like Node.js, deno, workers, ...\n\n- 📖 Study [the documentation](https://twind.style)\n- 🤖 Try [the playground](https://twind.run)\n- 🧭 Explore [the examples](https://twind.style/examples)\n- 📓 Consult [the API reference](https://twind.style/packages)\n- 📜 Read [the changelog](https://github.com/tw-in-js/twind/tree/main/CHANGELOG.md)\n\n---\n\n**Nov 18, 2022: [Twind v1](https://github.com/tw-in-js/twind/tree/main) is now in stable release!**\n\nCheck out the [Migration Guide](https://twind.style/migration#from-twind-v016) to upgrade or go to the [v0.16 branch](https://github.com/tw-in-js/twind/tree/v0.16).\n\n---\n\n## ✨ Features\n\n**⚡️ No build step**\n\nGet all the benefits of Tailwind without the need for Tailwind, PostCSS, configuration, purging, or autoprefixing.\n\n**🚀 Framework agnostic**\n\nIf your app uses HTML and JavaScript, it should work with Twind. This goes for server-rendered apps too.\n\n**😎 One low fixed cost**\n\nTwind ships the compiler, not the CSS. This means unlimited styles and variants for one low fixed cost.\n\n\u003cdetails\u003e\n  \u003csummary\u003e\u003cstrong\u003eOther features\u003c/strong\u003e\u003c/summary\u003e\n\n- 🌎 No bundler required: Usable via CDN\n- 🎨 Seamless integration with Tailwind\n- 🤝 Feature parity with Tailwind v3\n- 🎯 Extended variants, rules, and syntax\n- 🚓 Escape hatch for arbitrary CSS\n- 🤖 Built in support for conditional rule combining\n- 🧐 Improved readability with multiline styles and comments\n- ❄️ Optional hashing of class names ensuring no conflicts\n- 🔩 Flexible: configurable theme, rules and variants\n- 🔌 Language extension via presets\n- 🎩 No runtime overhead with static extraction\n- 🚅 Faster than most CSS-in-JS libraries\n- ⚡ Fully tree shakeable: Only take what you want\n- 🦾 Type Strong: Written in Typescript\n- and more!\n\n\u003c/details\u003e\n\n## 📖 Documentation\n\nThe full documentation is available at [twind.style](https://twind.style).\n\n## 💬 Community\n\nFor help, discussion about best practices, or any other conversation that would benefit from being searchable use [Github Discussions](https://github.com/tw-in-js/twind/discussions).\n\nTo ask questions and discuss with other Twind users in real time use [Discord Chat](https://chat.twind.style).\n\n## 🧱 Contribute\n\nSee the [Contributing Guide](./CONTRIBUTING.md) for information on how to contribute to this project.\n\n## 🌸 Credits\n\n### 💡 Inspiration\n\nIt would be untrue to suggest that the design here is totally original. Other than the founders' initial attempts at implementing such a module ([oceanwind](https://github.com/lukejacksonn/oceanwind) and [beamwind](https://github.com/kenoxa/beamwind)) we are truly standing on the shoulders of giants.\n\n- [Tailwind CSS](https://tailwindcss.com/): created a wonderfully thought out API on which the compiler's grammar was defined.\n- [styled-components](https://styled-components.com/): implemented and popularized the advantages of doing CSS-in-JS.\n- [htm](https://github.com/developit/htm): a JSX compiler that proved there is merit in doing runtime compilation of DSLs like JSX.\n- [goober](https://github.com/cristianbote/goober): an impossibly small yet efficient CSS-in-JS implementation that defines critical module features.\n- [otion](https://github.com/kripod/otion): the first CSS-in-JS solution specifically oriented around handling CSS in an atomic fashion.\n- [clsx](https://github.com/lukeed/clsx): a tiny utility for constructing class name strings conditionally.\n- [style-vendorizer](https://github.com/kripod/style-vendorizer): essential CSS prefixing helpers in less than 1KB of JavaScript.\n- [UnoCSS](https://github.com/antfu/unocss): for the configuration syntax.\n- [CSSType](https://github.com/frenic/csstype): providing autocompletion and type checking for CSS properties and values.\n\n### 🤝 Contributors\n\nThank you to all the people who have \u003ca href=\"https://github.com/tw-in-js/twind/graphs/contributors\"\u003ealready contributed\u003c/a\u003e to twind!\n\n### 🙏🏾 Sponsors\n\nThis project is kindly sponsored by \u003ca href=\"https://www.kenoxa.com\" target=\"_blank\"\u003eKenoxa GmbH\u003c/a\u003e who support [@sastan](https://github.com/sastan) to maintain this project as part of their open-source engagement.\n\n\u003ca href=\"https://www.copilottravel.com\" target=\"_blank\"\u003eCOPILOT TRAVEL\u003c/a\u003e is partnering with [@sastan](https://github.com/sastan) to keep twind aligned with the latest Tailwind CSS releases.\n\nThank you to all our sponsors!\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://twind.style/sponsors.svg\"\u003e\n    \u003cimg src=\"https://twind.style/sponsors.svg\" alt=\"Sponsors\"/\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\nPlease ask your company to also support this open source project by becoming a sponsor on [opencollective](https://opencollective.com/twind#sponsor) or [GitHub](https://github.com/sponsors/tw-in-js).\n\n## ⚖️ License\n\nThe [MIT license](https://github.com/tw-in-js/twind/blob/main/LICENSE) governs your use of Twind.\n","funding_links":["https://github.com/sponsors/tw-in-js","https://opencollective.com/twind","https://ko-fi.com/twind"],"categories":["JavaScript","Tools","TypeScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftw-in-js%2Ftwind","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftw-in-js%2Ftwind","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftw-in-js%2Ftwind/lists"}