Open Collective
Open Collective

TailwindCSS Classnames

Functional and type-safe TailwindCSS Classnames and more using TypeScript.

Contribute


Become a financial contributor.

Financial Contributions

Recurring contribution
Backer

Become a backer for $2.00 per month and support us

Starts at$2 USD / month

Latest activity by


Recurring contribution
Sponsor

Become a sponsor for $50.00 per month and support us

Starts at$50 USD / month

Custom contribution
Donation
Make a custom one-time or recurring contribution.

Latest activity by


Top financial contributors

1
Joshua Gugun Siagian

$5 USD since Jun 2022

2
Felix Hungenberg

$2 USD since Sep 2022

TailwindCSS Classnames is all of us

Our contributors 3

Thank you for supporting TailwindCSS Classnames.

Budget


Transparent and open finances.

View all transactions
Monthly financial contribution to TailwindCSS Classnames ...

Credit from Felix Hungenberg to TailwindCSS Classnames

+$2.00USD
Completed
Contribution #571961
Financial contribution to TailwindCSS Classnames

Credit from Joshua Gugun Siagian to TailwindCSS Classnames

+$5.00USD
Completed
Contribution #547849
$
Today’s balance

$5.18 USD

Total raised

$5.18 USD

Total disbursed

--.-- USD

Estimated annual budget

$5.88 USD

About


TailwindCSS is based on strings and with some nice tooling on top like TailwindCSS VSCode extension you get a pretty descent experience. That said, there are limitations to a purely declarative approach of strings. 


When using tailwindcss-classnames you will get additional power in the form of:

  •  Validation of classnames: You can not write the wrong classname, cause the API only allows you to insert valid classnames
  •  Functional approach: Since we are working in Typescript we get more freedom in using functional powers like composition and dynamic composition
  • Defining by variables: Even though it is nice to write TailwindCSS inline with your elements, it does not scale. You want to move definitions outside of the component for reusability and composition
  • Support for all editors and IDEs: Because it's just TypeScript types, you get these powers in all editors and IDEs that support TypeScript.
You can not get this experience using pure TailwindCSS and the VSCode extension, but you do get it with tailwindcss-classnames.

Our team