Our great sponsors
-
-
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
-
-
WorkOS
The modern identity platform for B2B SaaS. The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning.
I find css-as-props is better than a huge string of classes, as it much more readable and statically analyzable. I wonder if anyone is working on a successor to styled-system (though it works fine).
[1] https://styled-system.com/
> their pay-for-documentation model
Yikers this comment sets the stage for a real bad game of phone tag! I think you're mistaking TailwindUI[0], the set of proprietary UI component cheat codes based on top of TailwindCSS, with TailwindCSS[1], the actual CSS library being discussed here.
[0] https://tailwindui.com/
[1] https://tailwindcss.com/
I use Mantine[0] which uses Emotion[1] for styling. I like keeping the CSS properties in a neat JSON object instead of a long string like Tailwind does. With the object approach, conditional styling is easier too. With Tailwind, you have to use cx or another package to do this and it makes the code a little hard to read.
Emotion isn't without it's flaws though. The company that created Emotion doesn't use it anymore because of runtime overhead[2] so Tailwind may be the future after all.
[0] https://mantine.dev
[1] https://emotion.sh/docs/introduction
[2] https://www.infoq.com/news/2022/10/prefer-build-time-css-js/...
Not much.
Tailwind's @apply just lets you apply Tailwind design tokens to CSS classes. It's useful for keeping designs looking consistent if you're already heavily invested in Tailwind.
This is probably not something you need to worry about unless you're working at a very large organization with many teams and web properties.
And there are other CSS-native ways of doing this without Tailwind too. Open Props is a good example (https://open-props.style/).
